Deferred Chaining

by Josh Carroll

HTML

<ul id='list'>
</ul>

JavaScript

function doStuffLater(msg){
    var def = $.Deferred();
    
    setTimeout(function(){
       def.resolve(msg);
    }, 500);
    
    return def.promise();
}

function addMessageToDom(msg){
    var li = $('<li></li>');
    li.text(msg);
    li.appendTo('#list');
}

doStuffLater("I'm first")
.then(function(msg){
    addMessageToDom(msg);
    return doStuffLater("I'm second");
})
.then(function(msg){
    addMessageToDom(msg);
    return doStuffLater("I'm third");
})
.then(function(msg){
    addMessageToDom(msg);
    return doStuffLater("HOLY CRAP THIS IS AWESOME!!!");
})
.then(function(msg){
    addMessageToDom(msg);
});