Deleting rows from multiple tables with jQuery

html, javascript, jquery

Solution

I'd give all the tables a common class and use the `rowIndex` property to filter out the `<tr>`s.

$('.blank').on('click', '.deleteLink', function () {
  var rowIndex = $(this).closest('tr').prop('rowIndex');
  $('.blank tr').filter(function () {
    return this.rowIndex === rowIndex;
  }).remove();
});

Here is a demo: http://jsbin.com/yugurekiri/1/edit?html,js,output

Problem

I have a row of nested table, each with an individual ID and multiple rows. In the first table (blank0) I have the action deleteLink ``` $(document).ready(function(){ $("#blank0 .deleteLink").on("click",function() { var tr = $(this).closest('tr'); tr.fadeOut(400, function(){ tr.remove(); }); return false; }); }); ``` This deletes the selected row as expected. What I want it to do is to delete the same row across all my tables. For example if I click the 3rd delete button, I would want it to delete the 3rd row on blank0 through to blank9

Original source