title: Giphy API Call Returning Results out-of-order
body: <p>I'm using an API call to Giphy to loop through a string array and return Gifs for each word in the string.</p>
  
  <p>It's working, but the results are showing up out of order. </p>
  
  <p>The beginning of the array is: "STATELY, PLUMP BUCK MULLIGAN CAME FROM THE STAIRHEAD"</p>
  
  <p>And the results show like: Plump Mulligan Came Buck... you get the idea...</p>
  
  <p>Here's the code:</p>
  
  <pre><code>    var chapter = "STATELY, PLUMP BUCK MULLIGAN CAME FROM THE STAIRHEAD," 
  
  let words = chapter.split(" ");
  
  for (i=0; i&lt;words.length; i++){
  
      let word = words[i];
  
      var queryURL = "http://api.giphy.com/v1/gifs/search?q=" + word + "&amp;api_key=&lt;MY API KEY&gt;";
      $.ajax({
          url: queryURL,
          method: 'GET'
          })
          .done(function(response) {
  
  
                  var results = response.data;
  
                      var gifDiv = $('&lt;div/&gt;');
                      var gif = $('&lt;img/&gt;');
                      gif.addClass('myImg');
                      gif.attr('src', results[0].images.fixed_height.url);
                      gif.attr('data-animate', results[0].images.fixed_height.url)
                      gif.attr('data-state', 'still');
                      gifDiv.append(gif);
  
                      gifDiv.append('&lt;h1&gt;' + word + '&lt;/h1&gt;');
  
                      gifDiv.appendTo($('#gifs-here'));
  
    })
  };
  </code></pre>
  
  <p>any ideas why the results are out of order?</p>