CODEWITHSUNDEEP
jquery
404notfound
404notfound

Reputation: 55

jquery loop not triggering jquery functions

I searched through stackoverflow and various other sites and can't seem to get an answer to this dilemma.

My aim is to have jQuery functions applied to divs in succession using an array with div id's.

I have the following code that isn't working for some reason:

$(document).ready(function(){
    $('#click').click(function(){ 
        var layout_list = ['1','2','3','4','5','6','7','8','9','10'];
        load_delay = 50;
        for (i = 0; i < layout_list.length; i++ ) {
            load_delay =  load_delay+50;
            setTimeout(function(){
                $("#l_"+layout_list[i]).css("visibility","visible");
                $("#l_"+layout_list[i]).addClass("bounceIn");
            },load_delay);
        }
    });
});

Upvotes: 0

Views: 28

Answers (1)

A. Wolff
A. Wolff

Reputation: 74420

You have to use a closure, e.g:

for (i = 0; i < layout_list.length; i++) {
    load_delay = load_delay + 50;
    (function (i) {
        setTimeout(function () {
            $("#l_" + layout_list[i]).css("visibility", "visible");
            $("#l_" + layout_list[i]).addClass("bounceIn");
        }, load_delay);
    }(i));
}

Upvotes: 1

Related Questions