JSFiddle - React, Tailwind, and code Playground

HTML

<button>Queue message</button>
<div id='console'></div>

JavaScript

function log(msg) {
    var $out=$("<div />");
    $out.html(msg);
    $("#console").append($out);
}

var mid=0; var queue=$.Deferred(); queue.resolve();

function sendMessage(msgId) {
        return $.ajax({
            type: "GET",
            url: "/echo/json/",
            data: {delay: 1},
            dataType: "JSON",
            success: function(){
                log("Success for " + msgId+ "");
            }
        });
}

function queueMessage() {
    var m=++mid;
    log("Queueing "+m)

    queue=queue.pipe( function() {
        return sendMessage(m);
    });
}

$("button").bind("click", queueMessage);

queueMessage();
queueMessage();