I am switching text in a loop for visual effect. This is what it looks like https://naejc.github.io/Script/GodsLies
This is the code
const symbols = ['God', 'Words'];
let count = 0;
const element = document.getElementById("WORD1");
const iteration = () => {
element.innerHTML = symbols[parseInt(count / 2, 10) % symbols.length];
if (count % 2 !== 0) {
element.classList.add("LANGUAGE");
} else {
element.classList.remove("LANGUAGE");
}
count++;
if (count === symbols.length * 2) {
count = 0;
}
};
let inthandle = setInterval(iteration, 270);
iteration();
Can someone please tell me how I can use this script across more than one instance? It has no effect if used again, attempting to create another element which switches text.
how do you try to create a "new" element? be aware, that each id can only be used once per page. it needs to be unique. otherwise the js code will use the first id it finds.
https://www.w3schools.com/html/html_id.asp
you may need to rewrite your code to use class or something like this:
var initWords = function (element) {
const symbols = ['God', 'Words'];
let count = 0;
const iteration = () => {
element.innerHTML = symbols[parseInt(count / 2, 10) % symbols.length];
if (count % 2 !== 0) {
element.classList.add("LANGUAGE");
} else {
element.classList.remove("LANGUAGE");
}
count++;
if (count === symbols.length * 2) {
count = 0;
}
};
let inthandle = setInterval(iteration, 270);
iteration();
}
initWords(document.getElementById("WORD1"));
initWords(document.getElementById("WORD2"));