JSFiddle - React, Tailwind, and code Playground

HTML

<a href="/echo/json/">1</a>
<a href="/echo/json/">2</a>
<a href="/echo/json/">3</a>

<div class="out"></p>

JavaScript

$(function () {
    var list = $("a"),
        que = [];
    
    
    for (var i = 0; i < list.length; i++) {
        var url = $(list[i]).attr("href");
        log("getting " + url + "...");
        que.push($.get(url, function(){
            log("callback");
        }));
    }
                    
    $.when.apply($, que).then(function () {
        
        handle1(arguments);
        handle2(arguments);
    })
    .fail(function (args) { log("ERROR."); });
    
});

// doesnt work -- no timeout.
function handle1 (args) {
    log("<br/>//////////<br/>all items fetched (handle1) - " + args.length + " responses.");
    for (var j = 0; j < args.length; j++) {
        //args[j] is a jqXHR object
        logResponse(args[j][2]);
    }
}

// works -- includes timeout to wait for loading
function handle2(args) {
    log("<br/>//////////<br/>all items fetched (handle2) - " + args.length + " responses.");
    for (var j = 0; j < args.length; j++) {
        //args[j] is a jqXHR object
        logResponse(args[j][2]);
    }
}

function logResponse(response) {
    log("<br/>== Response ==");
    log("statusText: " + response.statusText);
    log("status: " + response.status);
    log("readyState: " + response.readyState);
    log("responseText: " + response.responseText);
}

function log () {
    if (window.console) {
        console.log(Array.prototype.slice.call(arguments));
        $(".out").append("<p>" + Array.prototype.slice.call(arguments) + "</p>");
    }
}