Question

I am trying to use the delegate method on a grid that I wrap with the DataTables.Net plug-in. I originally had this code which works as expected.

    $("#myGrid tbody tr").click(function() {
        var id = $(this).children('td').eq(0).text();
        alert(id);
    });

However, if I change the paging size then the newer rows don’t have the click event calling the function. I decided the new JQuery delegate method should do exactly what I wanted; however, it does nothing at all on any tr element.

Could anyone explain why this does not work :

    $('#myGrid tbody').delegate('tr', 'click', function() {
        var id = $(this).children('td').eq(0).text();
        alert(id);
    }); 

I have tried different combinations of the selector and none get it to work.

Answer 1

Use this:

$("#myGrid tbody tr").live('click', function() {
    var id = $(this).children('td').eq(0).text();
    alert(id);
});

.live() works for current of future elements.