0

I am having a challenge to delete a table row using jQuery. Similar problems I find here on stackoverflow or examples of how to add or delete rows dynamically all seem to use the live instead of click method, the former now deprecated in favour of click. As well, other examples don't address delete a row chosen for deletion, opting for the last row usually.

I have set-up a jsfiddle. After adding a row if I click on Del Row, nothing happens. If it possible the challenge arises from the table row containing the delete button being added to the DOM dynamically? Here is the block of code I need help with:

$('.delrow').click(function(){
    var tr = $(this).closest('tr');
    console.log($tr);
    $tr.remove();
    var $id = $id-2;
});
dwlamb
  • 885
  • 2
  • 7
  • 14

1 Answers1

4

Use event delegation, and the variable is tr not $tr

 $(document).on('click','.delrow',function(){
    var tr = $(this).closest('tr');
    console.log(tr);
      tr.remove();
    var $id = $id-2;
  });

Working Demo

Wilfredo P
  • 4,070
  • 28
  • 46