Question

I currently have a table that looks something like this…

 <table>
    <tr>
      <td>1</td>
      <td>2</td>
      <td><a href="#" class="remove">Remove</a></td>
    </tr>
    <tr>
      <td>1</td>
      <td>2</td>
      <td><a href="#" class="remove">Remove</a></td>
    </tr>
    </table>

When clicking on the remove link, I would like to hide that current . This is the following code I’ve tried, but with no luck.

$(".remove").click(function() {

  $(this).parent("tr").hide();

}); 

Answer 1

You need closest() function of jquery to see the closest up the hierarchy. Parent will look just one level.

$(".remove").click(function() {

  $(this).closest("tr").hide();

});