Почему я получаю другой массив?

Добрый день. У меня проблема с указанием разных массивов;

мой код следующий:

setInterval(function() {

var TestName = [];
var requests = [];
TestName.push('0');
for($i=1; $i<8; $i++) {
    var id = $i;
    requests.push($.post("./Scripts/", {
    record:id,
    opt:'get_test'
    }, function(data){
          TestName.push(data);
    }));
}

 $.when.apply($,requests).done(function(){

     for($i=1; $i<8; $i++) {
$('#test'+$i).html('').html(TestName[$i]);

}
alert(TestName);
 });

}, 15000);

Этот код работает, но каждый раз, когда я получаю разные массивы ...

Например:

alert(TestName); результат один:

0,
<a href="#"><img src="./images/test1.png"></a>,
<a href="#"><img src="./images/test2.png"></a>,
<a href="#"><img src="./images/test3.png"></a>,
<a href="#"><img src="./images/test4.png"></a>,
<a href="#"><img src="./images/test5.png"></a>,
<a href="TestTestTestTestTest.php"><img src="./1358997710.jpg"></a>,
<a href="#"><img src="./images/test7.png"></a>,

alert(TestName); результат два:

0,
<a href="#"><img src="./images/test1.png"></a>,
<a href="#"><img src="./images/test2.png"></a>,
<a href="TestTestTestTestTest.php"><img src="./1358997710.jpg"></a>,
<a href="#"><img src="./images/test3.png"></a>,
<a href="#"><img src="./images/test5.png"></a>,
<a href="#"><img src="./images/test4.png"></a>,
<a href="#"><img src="./images/test7.png"></a>

Как видите, элементы массива каждый раз меняются местами, и иногда элементы массива располагаются в неправильном порядке.

Подскажите пожалуйста где может быть ошибка в коде?

Ответы на вопрос(1)

Ваш ответ на вопрос