JSFiddle - React, Tailwind, and code Playground

JavaScript

var partes = ["eu","to","com","o ludio","\n","que tá","com"];
var pessoas = ["o lula","a dilma","o silval"];


(function(){
   //return;
    var ultimoGrito = null;
    
    function gritar(txt){
        if( ultimoGrito ){
        
            ultimoGrito.style.fontSize = "12px";                    
            ultimoGrito.style.border = "0px";
        }
        
        var span = document.createElement("span");
        document.body.appendChild(span );     
        
        span.style.fontSize = "20px";
        span.style.color = "red";
        span.style.padding = "0px 2px";
        if(txt){
            span.style.borderBottom = "1px dotted red";
        }
        span.innerText = txt;
            
        ultimoGrito = span;
    }
    

    
    var pointer = 0;
    var i = -1;
    var pointerPessoa = 0;
    
    setInterval(function(){
        i++;
        if( i <= 4 ){ 
            
            gritar(partes[pointer]);
            pointer++;        
            return;
        }     
            
        if( i <= 6)
        {
            if( i < 6 || pointerPessoa +1 < pessoas .length       ){
                gritar(partes[pointer]);
            }
            
        if( i == 6) pointer++;      
        return;
            
        }     

        
        gritar( partes[pointer] + " " + pessoas[pointerPessoa++] + "\n");
        i = 4;
        
        pointer--;
        if( pointerPessoa >= pessoas.length){
            pointer = 0;
            i = -1;            
            pointerPessoa = 0;
            gritar("\n");
        }
      
       
        
    },500);
    
    
    
})();

//By: Luan de Castro
//[email protected]