JSFiddle - React, Tailwind, and code Playground
HTML
<div id="res"></div>
<div id="done"></div>
CSS
em{
display: block;
}
JavaScript
var deferred = $.Deferred();
function getAjax() {
var arr = [];
var deferreds = [];
//dummy data filling
for (var i = 0; i < 5; i++) {
arr.push(i);
}
$.each(arr,function(i,v){
var data = {"json":JSON.stringify({ text: 'id no# ' + v +" resolved"}) };
deferreds.push(
$.ajax({
url:"/echo/json/",
data:data,
type:"POST",
success:function(response){
$("#res").append("<em>"+response.text+"</em>")
}
}))
});
return deferreds;
}
var resolveData = getAjax();
$.when.apply(null, resolveData).done(function() {
$("#done").append("<p>All done!</p>");
});