title: AJAX callbacks when getting multiple XML files
body: <p>I'm trying to get a better understanding of how callbacks work.</p>
  
  <p>In this example, I want to get two or more XML files using AJAX, then extract the content I need from them, and then store that data in an array outside of the AJAX call. I want to use the "dataExt" array to plot a google chart, but I am getting hung up implementing callbacks properly. I guess my brain just isn't big enough yet!   </p>
  
  <p>Here's my code snippet.  </p>
  
  <pre><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  
     // List of xml files.
     var xmlFeed = ['rss-feed1.xml', "rss-feed2.xml"];
  
    // An array to store each "dataString" from each XML file.
     var dataExt = [];
  
      for(var i = 0; i &lt; xmlFeed.length; i++) {
  
          $.ajax({
          type: "GET",
          dataType: "xml",
          async: true,
          url: xmlFeed[i],
          contentType: "text/xml; charset=UTF-8",
          success: function(xml){
  
              var content = $(xml).find("content");
              var dataString = (content.text());
              console.log(dataString);
  
              // Need to push "dataString" to "dataExt" array.
              // dataExt = dataExt.push(dataString); &lt;-- this doesn't work 
  
              }  
  
          }) // close ajax    
      } // close loop
  
      console.log(dataExt[0]);
      console.log(dataExt[1]);
  
  &lt;/script&gt;
  </code></pre>