Returned Ajax Array Not Being Copied To Array

I have simple AJAX function that uses jQuery to return an array of 300 test objects from a database. I can see the data is returned, and I can use FireBug to step through the first

Solution 1:

The AJAX request happens asynchronously - you're not waiting for it to complete before you try and display the data.

Move the display code into the callback and it should work.

Solution 2:

It should help if you add planetArray = []; before the example code.

Solution 3:

Actually just mergin both answers. Like Greg said it works asynchronously meaning when second part (// display the data loop) is executed, the request didn't come back yet, so array is not filled.

var planetArray = [];
//retrieve star locations to display on page
$.getJSON("stars.php?jsoncallback=?", function(data) {
  for (var x = 0; x < data.length; x++) {
    planetArray.push(newPlanet(data[x].xpos, data[x].ypos));
  }
  for (var i = 0; i < planetArray.length; i++) {
    // exectutes after part below// data already filled
  }
});

for (var i = 0; i < planetArray.length; i++) {
  // NO DATA YET
}