Tratando de escribir una función, que funcione para un elemento de la matriz, y después de un tiempo, repite el mismo trabajo para el siguiente elemento (para cada elemento de la matriz). La matriz consta de elementos <span> .
La función actual funciona para todos los elementos al mismo tiempo.
const wordIntroGroup = document.getElementsByClassName("word"); const forwardBut = document.getElementById("forward"); forwardBut.addEventListener("click", forward); function forward() { const y = wordIntroGroup; for (let i = 0; i < y.length; i++) { setTimeout(function() { console.log(y[i]); }, 2000) } } <p> <span class="word">Naw,</span> <span class="word">while</span> <span class="word">you're</span> <span class="word">here</span> </p> <span id="forward" class="material-icons"> fast_forward </span>Su ciclo for ejecuta todas las llamadas de su función setTimeout al mismo tiempo. Por lo tanto, todo ocurrirá 2000 ms después de que se ejecute el ciclo for. La solución más simple sería extender la duración de setTimout por la de la ubicación actual en la matriz.
setTimeout(function (){ console.log(y[i]); }, 2000*i) // multiply your duration by i, the index of your current element in the array Además, su error de sintaxis es que no cerró la función forward al final de su secuencia de comandos