selecting and deleting a row

Question

For adding rows i wrote the code like this

$('#tab1 tbody ').append('<tr id='+i+'><td>'+k+'</td><td>'+l+'</td><td>'+m+'</td></tr>');

in the previous snippet i is global value..

Now if i am trying to select newly added row it is not recognizing.. for selecting i wrote like this

$('#tab1 td').click(function(){
 alert(i);
 $(this).parent().remove();
});

Do you see any mistakes?

Answer 1

I think your td elements are having invalid id's. ID should not start with numbers. Try appending some static text before i.

Also you have to use .live() event to get the elements that are generated in js

$('#tab1 td').live("click", function(){
   alert(i);
   $(this).parent().remove();
});

Answer 2

You're only adding the click handler to the <td> elements that exist when the .click() line executes.

You need to call the .live() function, which will add your handler to all elements that match the selector, no matter when they were created.