How would I get to increment the set timeout to apply to each classname pause?

Question

I need help trying to increment my for loop so after 8 seconds my divs show not just one. I would prefer vanilla js if possible.

I have tried doing my own for loop and settimeout I have failed.

var googleAds = document.getElementsByClassName('pause');
var i;
for(var i = 0; i < googleAds.length; i++) { 
    setTimeout(function () {
    googleAds[i].style.display = "block";
}, 8000);
 }

isplaying after 8 seconds

Do you want them to show up 8 seconds after the previous element and not all at the same time? — Benedikt, Aug 29 '19 at 20:29
I want to show them all at the same time once that 8 seconds has hit. I want to know what is the best way to do this I am stuck. — ejg699, Aug 29 '19 at 20:42

score 0 · Accepted Answer · answered Aug 29 '19 at 20:47

0

You need to use the for loop inside the anonymous function for i to be in scope:

setTimeout(function () {
  for(var i = 0; i < googleAds.length; i++) { 
    googleAds[i].style.display = "block";
  }
}, 8000);

answered Aug 29 '19 at 20:47

TheMaster

45,448
6
62
85

Thank you this worked for me. – ejg699 Aug 29 '19 at 20:56

How would I get to increment the set timeout to apply to each classname pause?

1 Answers1