When I click the next page in datatables my jquery selectors aren’t working anymore

I’m a big fan of Stack Overflow and I tend to contribute regularly (am currently in the top 0.X%). In this category (stackoverflow) of posts I will will be posting my top rated questions and answers. This, btw, is allowed as explained in the meta thread here.

My question was:

I’m using datatables plugin for jquery to show my data on the page. I have this selector when someone clicks on a row:

$('#myTable tr[class !="tableHeader"]').click(function(){
    alert("clicked!");
}

and everything is OK until I click on the “Next page” which shows me next 10 results – then this click function doesn’t show “clicked” message box anymore no matter which row I click.

I’m guessing that the problem is in a way how these new results (rows in the table) are shown, so please give me some ideas on how to solve this.

 The answer, by ghayes, was:

Use jQuery’s Live function. Live will apply to all elements on the page, even ones that don’t exist yet (I assume this is your issue). Thus, your new rows will be clickable when they are created and added to the DOM.

$('#myTable tr[class !="tableHeader"]').live('click',function(){
  alert("clicked!");
});