JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<body>
<div id="dice">
</div>
<button id="btn">
Grow
</button>
</body>
</html>

CSS

#dice {
  width:100px;
  height: 100px;
  background: yellow;
}

JavaScript

const btn=document.getElementById("btn");
btn.addEventListener("click", start_growth);

function start_growth(){
    const dice = document.getElementById("dice");
    let diceWidth=100;
    
    const interv=setInterval(grow, 5);

    function grow(){
        if(diceWidth>=300){
            clearInterval(interv);
        }else{
            diceWidth++;
            dice.style.width= diceWidth + "px";
        }
    }
}