If one div is shown, close the other when showing a new one

If one div is shown, close the other when showing a new one

I have this code which when you click the delete button of a particular row, it shows up the div .delete over that particular row, and when clicking on the cancel button on the .delete div, it'll close that the .delete row revealing the .row div again (the .row div doesn't actually hide, I handle the overlay with z-index).

However, I want it so that if one .delete div is already shown I want it to close it before revealing a new .delete div, so you can never have 2 .delete divs open at any given time.

Here's my code at the moment:

  1. $(".deletebutton").click(function() { 
  2.                    $(this).parents(".row").siblings(".delete").show('fast');
  3. });
  4. $(".cancel").click(function() {
  5.                    $(this).parents(".delete").hide('fast');
  6. });
  7. });

Any help is appreciated. :)