Execute animations sequentially instead of simulatenously using class selector

Question

Self admitted newbie here, hope this will be a simple solution.

$(.classname).slideUp();

When I execute the above code, all of the elements slide up at the same time. Instead, I would like them to perform the animation one after another.

Any help? Thanks!

Answer 1

Try this:

var animInterval = 100; // 100ms interval between animation starts
$('.className').each(function (i, e) {
    setTimeout(function () {
        $(e).slideUp();
    },i * animInterval);
});