JSFiddle - React, Tailwind, and code Playground

HTML

<html>

<head>
</head>

<body>
    
    <input type="button" value="Change Volume" id="Volume"/>
    <span id="volumeNumber"></span>
    
</body>

</html>

JavaScript

$(function() {
                    $("#Volume").click(function() {
                                           
                        setTimeout(triggerVolumeChange, 4000);
                        function triggerVolumeChange() 
                        {
                                                 
                            var volumeDiv = document.getElementById("ph");
                            var volumeOld = 8;
                            var volumeNew = 37;
                            var timeNew = (1000/(volumeNew-volumeOld));
                            changeVolume();
                            
                            function changeVolume()
                            {
                                volumeDiv.innerHTML = volumeOld;
                                volumeOld++;
                                if (volumeOld <= volumeNew) setTimeout(changeVolume, timeNew);
                            };
                                                      
                        };
                                                
                    });
                });