Chaining jQuery animations that affect different elements

Question

$(document).ready(function() {
    $(\"#div1\").fadeIn(\"slow\");
    $(\"#div2\").delay(500).fadeIn(\"slow\");
    $(\"#div3\").delay(2000).fadeIn(\"slow\");
    $(         


        

Answer 1

This can be done elegantly since 1.8:

$("div").toArray().map(function(e){
    return function(){
        return $(e).fadeIn(600).promise()
    };
}).reduce(function( cur, next ){
    return cur.then(next);
}, $().promise());

http://jsfiddle.net/f3WzR/