Finding a correct parent div, from a link with an ID jquery?

I have a list of updates for my website which are displayed from mysql using a while loop something like.

while ($update = $q -> fetch(PDO::FETCH_ASSOC)) {

            echo '<div class="displayBox"><div>
            <span class="date">' . $update['dateTime'] . '</span>';
            typeColor($update);
            echo '</div>
            <p class="spacer indent">' . $update['message'] . '<a id="' . $update['id'] . '" class="delete deleteUpdate" href="#">Delete</a></p>
            </div>';
        }

Upon someone clicking the delete button I run a simple jquery ajax request like:

$('.deleteUpdate').click(function() {

var id = $(this).attr('id');
$.ajax({data: {deleteUpdate: id},
            success: function() {

        window.location =开发者_Go百科 pageURL;
    }
});
});

Upon success I reload the page, is it possible to not reload the page but to instead hide the update that has been deleted, saving server requests? How would I make jquery find the correct parent with the class="displayBox" ?

Thanks

Try using jquery parents with selector -

Demo - http://jsfiddle.net/BgnXL/2/

$('.deleteUpdate').click(function() {
  // self for ajax handling
  var self = $(this);
  var id = self.attr('id');
  self.parents('.displayBox').hide();
});

Try:

$('#' + id).closest(".displayBox").hide();

You can use the parent function. http://api.jquery.com/parent/ I would put this in the callback for the click event.

var self = $(this);
$.ajax({ success:function() {
  self.parent().hide();
}