JSFiddle - React, Tailwind, and code Playground

HTML

<input type="button" value="Stop" id="stop"/>
<input type="button" value="Start" id="start"/>
<div id="div"></div>

JavaScript

var tx = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "g", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "y", "z"];

var interval;
var x = 0;
function loop() {
 
    interval = setInterval(function() {
        
        $("#div").append(tx[x] + " <br />");
        x++;
        
        if(x >= tx.length)
            clearInterval(interval);
        
    }, 500);
    
}

function stop() {
 
    clearInterval(interval);
    
}

$("#start").on("click", loop);
$("#stop").on("click", stop);