A generated button using Jquery's method is not working. The Id of the generated button is gpaCalculate. I have tried with both click and on methods but its not working. I don't know where I went wrong. Here is a link to my whole code: https://jsfiddle.net/4rxq49ko/

 $(document).on("click","#gpaCalculate",function(){
    displayDetails();
})

generated button JQuery

$("#DropDownList1").change(function () {
      myval = parseInt($(this).val());
      $(".tableAppend").empty();

      $(".tableAppend").append('<tr><th></th><th>Courses</th><th>Credit Hours</th><th>Grade</th></tr>');
      $(".tableAppend").append('<tr><input type="submit" name="calculateGPA" value="Click Me" id="calculateGPA" /></tr>');
      for (var i = 1 ; i <= myval ; i++) {
          $(".tableAppend").append('<tr><td>' + (i) + '.</td><td><input name="courseTextBox' + i + '" type="text" id="courseTextBox' + i + '"></td>' +
              '<td><input name="creditTextBox' + i + '" type="text" id="creditTextBox' + i + '">  </td>' +
              '<td><select id="gradeSelect' + i + '">' +
                                   '<option value ="A">A</option>' +
                                   '<option value ="A-">A-</option>' +
                                   '<option value ="B+">B+</option>' +
                                   '<option value ="B">B</option>' +
                                   '<option value ="B-">B-</option>' +
                                   '<option value ="C+">C+</option>' +
                                   '<option value ="C">C</option>' +
                                   '<option value ="C-">C-</option>' +
                                   '<option value ="D">D</option>' +
                                   '<option value ="F">F</option>' +
                 '</select></td>');

      }
      $(".tableAppend").append('<tr><td></td><td><button type="submit" id="gpaCalculate" >Calculate GPA</button></td>');
  });

Related posts

Recent Viewed