JQuery - Delete () after hide ()

Question

I have a div that I want to remove using remove (). I want to show animation before / during the removal of a div. I could only show the animation by hiding the div.

If I want to show the animation, then delete (). How it's done?

Code so far:

//Delete Button - delete from cart $('.ui-icon-trash').live('click',function() { $(this).closest('li').hide("puff", {}, 1000) }); 

Answer 1

Do this in the callback function for .hide() (jQuery UI .hide() link ), for example:

 $('.ui-icon-trash').live('click', function() { $(this).closest('li').hide("puff", {}, 1000, function() { $(this).remove(); }); }); 

The function at the end is executed as a callback executed when the animation is done ... so when you want :)

Answer 2

You can also check this:

 $(this).hide("puff").delay(10).queue(function(){$(this).remove();});