title: Populate each json data in certain interval
body: <p>I would like to populate data that comes out of json using <code>$.getJSON</code> in certain interval.</p>
  
  <p>I am able to populate data, but it all comes at once. What I need is to show each data in certain interval (maybe 3secs).</p>
  
  <p>here is the working fiddle <a href="https://jsfiddle.net/nyzht697/" rel="nofollow noreferrer">https://jsfiddle.net/nyzht697/</a> </p>
  
  <p>I tried using <code>setTimeout ( function ()</code> but yet it loads everything at once.</p>
  
  <pre><code>$.each(transactionData, function(i, item) {
  
  var time = '&lt;span class="time text-light d-block"&gt;' + item.Time + '&lt;/span&gt;';
  var date = '&lt;span class="date d-block"&gt;' + item.Date + '&lt;/span&gt;';
  var amount = '&lt;span class="value d-block"&gt;' + item.CryptoAmount + ' ' + item.CryptoType + '&lt;/span&gt;';
  var cost = '&lt;span class="diff text-success d-block"&gt;~' + item.Cost + '&lt;/span&gt;';
  
  
  setTimeout ( function () {
      transactionItem += '&lt;li&gt;' + time + date + '&lt;/li&gt;';
    }, 4000);
  
  });
  </code></pre>
  
  <p>this is what i tried but it populates everything at once.</p>