using setTimeout in each loop does not work

Question

I have a huge galerie with about 400 pictures. I made a button so i can delete all pictures from the DOM and also from the server (by using an ajax request for each file).

I tried to use setTimeout inside my for each loop to give all items a background-color of red, just for testing. However nothing happens if i click my button!

    //run trough all pages
    pages.each
    (
        function()
        {
            var items = $(this).children("ul").children("li");

            //run through each item of the page
            items.each
            (
                function()
                {
                    setTimeout(function() { $(this).css("background-color","red"); }, 100);
                }
            );
        }
    );

If i run this code without setTimeout, then it works. I also tried other waiting times. No errors are thrown.

Note, when you run something in setTimeout, context changes and `this` will point to something else — Rajesh, Sep 05 '16 at 13:06
This might help. http://stackoverflow.com/questions/2130241/pass-correct-this-context-to-settimeout-callback — Rajesh, Sep 05 '16 at 13:08

score 2 · Accepted Answer · answered Sep 05 '16 at 13:10

2

this should work

setTimeout(function(el) { el.css("background-color","red"); }, 100, $(this));

answered Sep 05 '16 at 13:10

Artem Gorlachev

597
4
9

using setTimeout in each loop does not work

1 Answers1