Edit in JSFiddle

;(function($){
    "use strict";
    /** jQueryDeferredTimeoutUtilities に於ける deferredEachのテストサンプル(AJAX版)
     * 使用バージョン:
     *   jQuery 1.x(edge)
     *   jQueryDeferredTimeoutUtilities 0.0.1 test version
     *    https://github.com/juner/jQueryDeferredTimeoutUtilities
     * 内容:
     *   jDTUtilと通常の非同期ループの書き方の違いについてのサンプル
     */
    $(function(){
        //利用するデータ
        var array = [
            function () { return $.ajax({type:"POST",dataType:"json", url: "/echo/json/", data: { json:JSON.stringify({key:"test1"}), delay: 8 } }); },
            function () { return $.ajax({type:"POST",dataType:"json", url: "/echo/json/", data: { json: JSON.stringify({key:"test2"}), delay: 6 } }); },
            function () { return $.ajax({type:"POST",dataType:"json", url: "/echo/json/", data: { json: JSON.stringify({key:"test3"}), delay: 2 } }); },
            function () { return $.ajax({type:"POST",dataType:"json", url: "/echo/json/", data: { json: JSON.stringify({key:"test4"}), delay: 10 } }); },
            function () { return $.ajax({type:"POST",dataType:"json", url: "/echo/json/", data: {json: JSON.stringify({key:"test5"}), delay: 4 } });}
        ];
        //deferredEach だとこう書く
        var $t = $("#target");
        
        $.deferredEach(array,function(k,v){
            return v().then(function(data){
                $t.append(
                    $("<li/>").text(data.key)
                );                
            });
        })
        .done(function(){
            //完了後の処理
            $t.append(
                $("<li/>")
                .css("color","red")
                .text("finish")
            );
        });
        
        //従来の書き方だとこう書く
        var $ot = $("#oldtarget");
        (function test(array){
            var a = (array || []).shift();
            if(typeof a!== "undefined"){
                a().then(function(data){
                    $ot.append(
                        $("<li/>").text(data.key)
                    );
                    test(array);
                })
            }else{
                //完了後の処理
                $ot.append(
                    $("<li/>")
                    .css("color","red")
                    .text("finish")
                );
            }
        })(array.slice());
    })
})(jQuery);
<h1><a href="https://github.com/juner/jQueryDeferredTimeoutUtilities">deferredEach</a> 版</h1>
<ul id="target"></ul>
<h1>従来版</h1>
<ul id="oldtarget"></ul>
<dl><dt>解説</dt><dd><p>test1〜test5迄の要素を順番にAJAXするサンプル</p><p>ここではわかりやすい様に取得した時点でリストに表示を行う。</p><p>最後の要素がAJAXで取得された時点で赤字のfinishを表示する。</p></dd></dl>

              

External resources loaded into this fiddle: