¿Cómo puedo hacer que el controlador de eventos de clic acelere la función de tipo y luego reemplace el texto con el deseado?

Cada función de tipo () se ejecuta al desplazarse si el bloque aparece a la vista

Mi código

https://jsfiddle.net/sp_true/b5rj8mvd/4/

 function typeCode(lineItem) { const codeLine = lineItem.querySelector(".type"), columnBlock = lineItem.querySelector(".column"), code = codeLine.innerHTML, lengthContent = lineItem.querySelector(".hide-text").innerHTML.split('br').length let str = code, i = 0, isTag, text; columnBlock.innerHTML = Array(lengthContent + 1).fill(0).map((_, i) => `<span>${i+1}</span>`).join('<br>'); (function type() { text = str.slice(0, ++i); if (text === str) return; lineItem.querySelector('.type').innerHTML = text; let char = text.slice(-1); if (char === '<') isTag = true; if (char === '>') isTag = false; if (isTag) return type(); setTimeout(type, 40); // Here is speed to All Block left anim (60) }()); }