Running async functions sequentially

http://stackoverflow.com/questions/14412026/jquery-how-to-run-a-function-as-soon-as-another-function-ends

by zarjay

HTML

<div class="one"></div>
<div class="two"></div>

CSS

.one {background:red;width:100px;height:100px;display:none}
.two {background:green;width:100px;height:100px;display:none}

JavaScript

function firstFunction(){
    $(".one").fadeIn(1000).delay(2000).fadeOut();
}
function secondFunction(){
    $(".two").fadeIn(1000).delay(2000).fadeOut();
}

firstFunction();
$('.one').promise().then(secondFunction);