JSFiddle - React, Tailwind, and code Playground

by marlberm2014

HTML

<a href="#">Click me!</a>
<div></div>

JavaScript

function GetSomeDeferredStuff() {
    var i = [1,2,3,4,5,6,7,8,9,10];
    var deferreds = $.map(i, function (count, index){
        if(count == 7) return $.Deferred().fail(function(){$("div").append("<p>Task #" + count + " failed.");}).reject();
        return $.post('/echo/html/', {
            html: "<p>Task #" + count + " complete.",
            delay: count
        }).success(function(data) {
            $("div").append(data);
        });
    });
    console.log(deferreds);
    return deferreds;
}

$(function() {
    $("a").click(function() {
        var deferreds = GetSomeDeferredStuff();

        $.when.apply($,deferreds).done(function() {
            $("div").append("<p>All done!</p>");
        }).fail(function(){
            $("div").append("<p>Something failed!</p>");
        });
    });
});