I go around the elements in this way:

jQuery.each($('#content_wrap > .an_post'), function() { setTimeout(function(){console.log('Hello timeout');}, 10000); });

for example

 $('#content_wrap > .an_post').size()

is equal to 4. Then, according to the idea .each will bypass 4 elements in 40 seconds, but it works after 10 and immediately displays 4 'Hello timeout' to the console. Why it happens? This plunges me into the depths of despair!

In general, I wanted to do something like this:

 jQuery.each($('#content_wrap > .an_post'), function() { $(this).fadeIn(1500); });

Those. So that 4 elements one after another disappeared with a difference in animation for about a second.

2 answers 2

according to the idea .each will bypass 4 elements in 40 seconds, but it works after 10 and displays 4 'Hello timeout' to the console right away. Why it happens?

as you know, setTimeout calls a function passed as a parameter after a certain period of time since the call to setTimeout itself, since in cycle 4 elements get sooooo fast, the difference between the calls is equal to milliseconds, which do not affect the overall picture

so that 4 elements one after another disappeared with a difference in animation for about a second

 $('#content_wrap > .an_post').each(function(idx){ $(this).delay(1000*idx).fadeOut(1500); });

    Posted on the knee. Sense, I think you will understand)

     jQuery.each($('#content_wrap > .an_post'), function(id) { $(this).delay(1000*id).fadeOut(1500); });