0

I have a table with on each row there is a column with a delete button with id="hiderow".

What I want is to hide that specific row when the button on that row is clicked. I have this code for this:

$(document).ready(function(){
  $("#hiderow").click(function(){$(this).parents("tr").hide(); })
});

The crazy thing is that it only works for the first row. If I do it for the second or other rows it does not work. How can I solve this?

Geveze
  • 393
  • 3
  • 12

2 Answers2

-1

$("#hiderow") - this one is selector by ID, and id should be unique for all elments at page. So $("#hiderow") return only first element with that id.

If you have multiple elements and want to aply some logic to each of them you should use class or at least $("#table>body>tr") selector to get all of them.

layonez
  • 1,746
  • 1
  • 16
  • 20
-1

Use class instead of id to listen event.

$(document).ready(function(){
  $(".hiderow").click(function(){$(this).parents("tr").hide(); })
});

<td class="hiderow">your content</td>
Rijosh
  • 1,538
  • 1
  • 8
  • 11