title: Sequence of fetches return out of order
body: <p>Why does this code:</p>
  <pre><code>for (i in posts) {
              console.log(posts[i].pk)
  
              fetch(`http://127.0.0.1:8000/api/blogs/${posts[i].pk}`)
                  .then((resp) =&gt; resp.json())
                  .then((data) =&gt; {
  
                      console.log(data)
  
                      var blogs = `
                          &lt;div class = &quot;center-div-row box-margin&quot;&gt;
                                  &lt;div style=&quot;flex:2&quot;&gt;
                                      &lt;h5&gt;${data.title}&lt;/h5&gt;
                                      &lt;hr&gt;
                                  &lt;/div&gt;
                                  &lt;div style=&quot;flex:1&quot;&gt;
                                      &lt;p&gt;${data.body}&lt;/p&gt;
                                  &lt;/div&gt;
                                  &lt;div style=&quot;flex:1&quot;&gt;
                                      &lt;p&gt;${data.created}&lt;/p&gt;
                                  &lt;/div&gt;
                                  &lt;button class=&quot;edit-btn&quot;&gt;Edit&lt;/button&gt;
                                  &lt;button&gt;Delete&lt;/button&gt;
                              &lt;/div&gt;       
                      `
                      display.insertAdjacentHTML('beforeend', blogs)
  
                  })
                  
          }
  </code></pre>
  <p>give me inconsistent API results? The data is displayed in different order and is just all out inconsistent. Any tips on how to make the fetch call better?</p>