I have plan to make a simple animation inside the webpage for demonstrate the motor rpm . the span element look like this

 <span id="motor"  style='font-size:100px;padding: 3%;'>&#8854;</span>

and my range slider for change the speed is

<input type="range" min="0" max="100" value="0" class="slider" id="Range0" step="5" onchange="changeSpeed(this.value);"   > 

I add the button which set the new speed for motor and its function is

 function changeSpeed(speed){
    
    setInterval( rotate_fan ,speed );  

     
 }
 
 function rotate_fan(){
var  div = document.getElementById('motor');
        deg0=deg0+direction0*10;
    div.style.webkitTransform = 'rotate('+deg0+'deg)'; 
    div.style.mozTransform    = 'rotate('+deg0+'deg)'; 
    div.style.msTransform     = 'rotate('+deg0+'deg)'; 
    div.style.oTransform      = 'rotate('+deg0+'deg)'; 
    div.style.transform       = 'rotate('+deg0+'deg)';
    
 }

but I didn't see any change any tips really appreciated