title: Get array value from AJAX request
body: <p>I have a script that reads a JSON file then populates an array with the name property of each element.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;script src="https://code.jquery.com/jquery-2.2.4.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  var a = [];
  
  var myMethod = function(){
      $.ajax({
          url : "numbers.json",
          dataType : "json",
          success : function(data){
              for(i in data){
                  a.push(data[i].name);
              }
          }
      });
  }
  
  myMethod();
  console.log(a[2]); // console.log() returns "undefined"
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>JSON</strong></p>
  
  <pre><code>[
      {"name" : "One"},
      {"name" : "Two"},
      {"name" : "Three"},
      {"name" : "Four"},
      {"name" : "Five"}
  ]
  </code></pre>
  
  <p>I cant't access a specific index of this array. The console log always returns <em>undefined</em>. I've tried to add <code>.then()</code> after my ajax call, but it doesn't work too.</p>