Animate.css - Wait for animation to finish before continuing

Question

I\'m currently using Animate.css for animation around the app I\'m creating. I\'m looking for a way to wait for the animation to finish before continuing. Here\'s what I thought

Answer 1

There's no cross-browser way to do this except for setting a timeout.

setTimeout($('#myDiv').empty, 500);

There are some browser-prefixed methods for this, but I think I remember them being unreliable. See this SO question: Callback on CSS transition

Answer 2

If this is about CSS animations then this

$("#myDiv").addClass("animated flipOutY")
           .on('animationend webkitAnimationEnd MSAnimationEnd oAnimationEnd', function(e) {
              $(this). ...
           });

If that animate.css uses actually transitions then you should use these events:

'transitionend webkitTransitionEnd MSTransitionEnd oTransitionEnd'