title: Alternative to "async: false" for successive AJAX calls
body: <p>I am using two <strong>AJAX GET</strong> requests to grab data from two different sources.<br> In each request I parse the response data, create a temporary array with the relevant data each item, and push this temporary array into a master array.<br>However, this only works if I include <code>"async: false"</code> in the <strong>AJAX</strong> request, which is now deprecated.<br> Is there an alternative way I could write this code? (NOTE: Although I am using two <strong>AJAX</strong> requests in this code snippet, I will probably need to use a total of four in the project I am working on).</p>
  
  <pre><code>function get_results() {
    $(document).ready(function() {
      var master_array = [];
      $.ajax({
        type: "GET",
        url: "http//:www.source1.com",
        dataType: "xml",
        async: false,
        success: function(xml) {
          $(xml).find('product').each(function() {
            var Average = $(this).find('Average').text();
            var Price = $(this).find('Price').text();
            var Name = $(this).find('Name').text();
            var Url = $(this).find('Url').text();
            var Image = $(this).find('Image').text();
            master_array.push([Average, Price, Name, Url, Image]);
          });
        }
      });
      $.ajax({
        type: "GET",
        url: "http//:www.source2.com",
        dataType: "xml",
        async: false,
        success: function(xml) {
          $(xml).find('product').each(function() {
            var Average = $(this).find('Average').text();
            var Price = $(this).find('Price').text();
            var Name = $(this).find('Name').text();
            var Url = $(this).find('Url').text();
            var Image = $(this).find('Image').text();
            master_array.push([Average, Price, Name, Url, Image]);
          });
        }
      });
    });
  }
  </code></pre>