Adding event handler to clicking on a td element has no effect?

gloosemo

I have the following datatable definition:

[code]
oTable = $('#receiptsTable').dataTable( {
"sDom": 'R<"H"<"recHead">lfr>t<"F"ip>',
"bProcessing": true,
"bAutoWidth": false,
"iDisplayLength": 20,
"sAjaxSource": '/index.php/recinput2/getreceipts',
"aoColumns": [
{ "sTitle": "Buyer", "sWidth": "12%", "bSortable": true, "bSearchable": true, "bVisible": true },
{ "sTitle": "Purpose", "sWidth": "9%", "bSortable": true, "bSearchable": true, "bVisible": true },
{ "sTitle": "Date", "sWidth": "11.5%", "bSortable": true, "bSearchable": true, "bVisible": true },
{ "sTitle": "Location", "sWidth": "16%", "bSortable": true, "bSearchable": true, "bVisible": true },
{ "sTitle": "Class", "sWidth": "14.5%", "bSortable": true, "bSearchable": true, "bVisible": true },
{ "sTitle": "Description", "sWidth": "16%", "bSortable": true, "bSearchable": true, "bVisible": true },
{ "sTitle": "Total Before Taxes", "sWidth": "7%", "bSortable": true, "bSearchable": false, "bVisible": true },
{ "sTitle": "Taxes", "sWidth": "7%", "bSortable": true, "bSearchable": false, "bVisible": true },
{ "sTitle": "Total After Taxes", "sWidth": "7%", "bSortable": true, "bSearchable": false, "bVisible": true },
],
"bPaginate": true,
"sPaginationType": "two_button",
"bLengthChange": false,
"bFilter": true,
"bSort": true,
"aaSorting": [],
"bjQueryUI": true,
});
[/code]

The table loads fine.

The problem is right after the oTable definition i'm trying to put in the simple event handler for when i click on a cell in the table, just to give a message:

[code]
$('#receiptsTable tbody td').on("click", function() {
alert("Clicked!");
});
[/code]

only when i click on a cell in the table i get no message? What's going on it seems very simple....

gloosemo

btw this is the table definition

[code]



[/code]

gloosemo

solved by using

[code]
$('body').on("click", "#receiptsTable tbody td", function () {
...
});
[/code]