title: How do I store the results of multiple asynchronous $.get requests in an array?
body: <p>I have a list of items being stored in an array. For each item in the array, I need to make an API request and add some of the data that comes back into another array so that I can perform operations on it later.</p>
  
  <p>I think the issue is that my get request is asynchronous, and as a result the data is not necessarily loaded when I am trying to add it to the array, but I thought that's what <code>.then</code> was supposed to cover.</p>
  
  <pre><code>var cardRequestList = ["Scapeshift","Ghostform", "Daybreak Chaplain"]
  
  var url = "https://api.magicthegathering.io/v1/cards?name=%22";
  
  var cardInfo =[];
  
  for (var cardName in cardRequestList){
    var results = getCard(cardRequestList[cardName]);
    cardInfo.push(results);
  }
  
  console.log(cardInfo); // results should come back here
  
  function getCard(cardName){
      var cardUrl = url.concat(cardName,"%22");
      $.get(cardUrl).then(
      function(data) {
        var temp = [data.cards[0].name,data.cards[0].printings]
        return temp;
      }, function() {
        alert( "$.get failed!" );
      }
    );
  }
  </code></pre>