Helper Helper - 1 year ago 105
jQuery Question

Issue in Button Click bind on Dom Ready

I am preparing Html table on Dom ready and trying to click the button in particular row. Below is my code.

url: Url + token,
method: "POST",
async: true,
data: JSON.stringify(data),
contentType: "application/json; charset=utf-8",
success: function (Result) {
var editButton = '<input type="button" class="EditRole" value="Edit">';
$.each(Roles, function( key, Role ) {
var Action = PrepareTd(editButton);
var tr = '<tr attr-id="' + Role.RoleID + '">' + Action + "</tr>";
error: function (jqXHR) {

$(document).ready(function() {
$('.EditRole').on("click", function() {

This never hit debugger. Am I missing something?

Answer Source

It's a event delegation issue Use this

$(document).ready(function() {
    $(document).on("click", '.EditRole', function() {
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download