试图循环ajax加载调用

Question

I'm trying to make a simple loop where an element gets loaded multiple times.

The loop works fine and the console.log shows it does get looped 5 times but when I look at the div that is supposed to have the content I want it only has the div once.

I don't quite know why it wont work (note I'm quite new to ajax).

This is my code:

// Jquery ajax loop (broken)

for (var i = 1; i <= 5; i++) {
    $(".WWBestelling").load("./demo.txt .ItemSmall");
    console.log("Item Added");
}

Answer 1

Because the old one will be replaced by the new one.

Instead of .load, you could use $.get to get the content then append to the target div.

for (var i = 1; i <= 5; i++) {
    $.get('./demo.txt', function(data) {
        $(data).find('.ItemSmall').appendTo('.WWBestelling');
        console.log("Item Added");
    });
}