JQueryのクリック1は何もしません

Question

私のforループに何か問題があります。私のウェブサイトのイベントが初めて起動されたとき、私は何の反応も得ません。それはその後毎回意図どおりに動作します。私はforループで数値をチューニングしようとしましたが、間違いを探していましたが、私が試したものまででした。それはそのままで動作します。完全なアプリケーションのための

：あなたのアヤックスは、変数を参照するために値をプッシュする前にhttps://codepen.io/xcidis/full/KvKVZb/

var reference = []; 

function random() { 
    $.ajax({ 
     url: "https://api.forismatic.com/api/1.0/?", 
     dataType: "jsonp", 
     data: "method=getQuote&format=jsonp&lang=en&jsonp=?", 
     success: function(quote) { 
     reference.push([quote.quoteText + "<br/><br/><br/><div align='right'>~" + quote.quoteAuthor + "</div>"]); 
     } 
    }); 
} 

$("button").click(function(){ 
    random(); 
    for(i=0;i<4; i++){ 
    if(reference[reference.length-1] == undefined){continue}else{ 
    var boxes = $("<div id='boxes'></div>").html("<p>" + reference[reference.length-1] + "</p>"); 
    $('body').append(boxes); 
     break; 
    }; 
    }; 
}); 

Answer 1

コードのあなたの残りが走りました。あなたは、AJAX以内にあなたのページのレンダリングコードを入れたり、同期

$("button").click(function(){ 
    $.when( $.ajax({ 
     url: "https://api.forismatic.com/api/1.0/?", 
     dataType: "jsonp", 
     data: "method=getQuote&format=jsonp&lang=en&jsonp=?", 
     success: function(quote) { 
     reference.push([quote.quoteText + "<br/><br/><br/><div class='tweet' align='left'></div><div align='right'>~" + quote.quoteAuthor + "</div>"]); 
     } 
    })).then(function() { 
     console.log(reference) 
     for(i=0;i<4; i++){ 
     if(reference[reference.length-1] == undefined){continue}else{ 
     var boxes = $("<div id='boxes'></div>").html("<p>" + reference[reference.length-1] + "</p>"); 
     $('body').append(boxes); 
      break; 
     }; 
     }; 
    });  
    });