function randomColor() { function colorNum() { return Math.floor(Math.random() * 256); } setInterval(function() { let elements = document.getElementsByClassName('circle'); for (let i = 0; i <= elements.length; i++) { elements[i].style.background = 'rgb(' + colorNum() + ',' + colorNum() + ',' + colorNum() + ')'; } }, 500) } 
 <div class='element'> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> </div> <div class='element'> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> </div> <button onclick="randomColor()" id='random'>Click For Random Colors</button> 

Closed due to the fact that the essence of the question is not clear to the participants Stepan Kasyanenko , aleksandr barakin , LFC , freim , Andrew March 20 at 16:05 .

Try to write more detailed questions. To get an answer, explain what exactly you see the problem, how to reproduce it, what you want to get as a result, etc. Give an example that clearly demonstrates the problem. If the question can be reformulated according to the rules set out in the certificate , edit it .

  • not enough code, no markup - Stranger in the Q
  • one
    What is the essence of the question? - kizoso

1 answer 1

About the hour hand - did not understand.

 function randomColor() { function colorNum() { return Math.floor(Math.random() * 256); } let i = 0; let elements = document.getElementsByClassName('circle'); setInterval(function() { elements[i].style.background = 'rgb(' + colorNum() + ',' + colorNum() + ',' + colorNum() + ')'; i = (i + 1) % elements.length; }, 100) } 
 .circle { width:20px; height:20px; border:1px solid black; display:inline-block; } 
 <div class='element'> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> </div> <div class='element'> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> <div class="circle"></div> </div> <button onclick="randomColor()" id='random'>Click For Random Colors</button> 

  • may not need setInterval? - Stranger in the Q
  • @StrangerintheQ I can, of course, comment it out, but I'm afraid then it will not work. - Igor
  • I'm talking about requestAnimationFrame .., though with it is somewhat more difficult - Stranger in the Q
  • if you can tell which tool to use to achieve the goal - tell me :) - kek
  • @kek if the result you get in this post suits you, then use this solution and use - Stranger in the Q