This is my current code below. It is generating a random number for me on loading the page and works fine for the target div. However, I want this to run this function within 8 separate divs. I obviously cannot have 8 divs with the same id so I changed this to getElementByClassName and changed the class on my div to vvv and got rid of the id but for some reason this doesn't work?
Also, do I need anything else in my script to call this function for more than one div? Any help much appreciated!
<script>
let text = "VAC";
window.onload = function () {
var output = document.getElementById("vvv");
setInterval(function () {
output.innerHTML = Math.floor(Math.random() * (115 - 105 + 1)) + 105 + " " + text;
}, 2000);//this value is the time between generating the number//
};
</script>
You are looking for getElementsByClassName (not getElementByClassName).
let text = "VAC";
let outputs = document.getElementsByClassName("vvv");
let randomDivs = function() {
for (let output in outputs) {
outputs[output].innerHTML = Math.floor(Math.random() * (115 - 105 + 1)) + 105 + " " + text
}
}
randomDivs()
setInterval(randomDivs, 2000); //this value is the time between generating the number//<div class="vvv"></div>
<div class="vvv"></div>
<div class="vvv"></div>
<div class="vvv"></div>
<div class="vvv"></div>
<div class="vvv"></div>
<div class="vvv"></div>
<div class="vvv"></div>You may write it like this.
<body>
<div class="vvv">1234</div>
<div class="vvv">1234</div>
<div class="vvv">1234</div>
<script>
let text = "VAC";
var output = document.getElementsByClassName("vvv"); //you can use getElementsByTagName("div") as well
setInterval(function (){
Array.from(output).forEach((item, index) => {item.innerHTML = Math.floor(Math.random() * (115 - 105 + 1)) + 105 + " " + text;}
)}, 2000)
</script>
</body>
Note: Didn't realize it was answered already with similar approach. You may try getElementsByTagName("div") as well as suggested. But it has it's limitations too.