Question

I have an array with IDs and I am loading elements with these IDs from another page.

    $.each(idArr, function() {
        var divline = '<div class="line" id="' + this + '">';
        var url = 'allitems.php #' + this + ' div';
        $('#the-list').append($(divline).load(url).hide().fadeIn());
    });

It works fine but I would like the loaded elements to fade in one at a time, or at least not all att once. I cannot figure out how to use .delay with my code. Or is there maybe another way?

Thank you 🙂

Answer 1

$.each(idArr, function(i,el) {
    var divline =  $('<div />', {'class':'line', id: el}),
        url = 'allitems.php #' + el + ' div';
    $('#the-list').append(divline.load(url).hide().delay(i*1000).fadeIn());
});