jquery loop not triggering jquery functions

Question

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);
        }
    });
});

possible duplicate of setTimeout in a for-loop and pass i as value — Ram
– Ram, Commented Sep 10, 2013 at 10:07

A. Wolff · Accepted Answer · 2013-09-10 10:05:45Z

1

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));
}

answered Sep 10, 2013 at 10:05

A. Wolff

74.4k9 gold badges98 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

404notfound Over a year ago

Thanks a lot. I feel like a complete noob now. I have it up and running now.

Collectives™ on Stack Overflow

jquery loop not triggering jquery functions

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related