JQuery closest not finding class

Question

I have the following structure which has several rows like:

<tr class="tableRow">
    <td>blah</td>
    <td>blah</td>
    <td><button id="13" class="deleteMailshot" type="button"></button></td>
</tr>

I want to perform an ajax call to delete the mailshot chosen then remove the row.

I'm using .closest() but it's not finding it... here's what I'm trying:

$.ajax({
    type: "POST",
    url: '/ajax/actions/deleteMailshot.php',
    data: {mailshot_id:mailshot_id},
    success:  function(data) {
        $(this).closest('.tableRow').fadeOut();
    }
});

I've also tried:

$(this).parent().parent('.tableRow').fadeOut();

Answer 1

Assign this to a variable before the AJAX. This refers to something else inside the anonymous function on success.

E.g.

var $button = $(this);

Then use:

$button.closest...

Answer 2

Try this

var self = $(this);
$.ajax({
  ....
  success:  function(data) {
    self.closest('.tableRow').fadeOut(); // use self