JS Progress Bar not working

https://codepen.io/Que_Tran000/pen/YBRvXv

Why isn’t the green progress bar increasing width from 1 to 100%?

CSS needs units (is it px, em, rem, vw, vh, percents etc.)

width: 1%;

It’s still not increasing to the right as progress increments.

In js it’s still unitless

elem.style.width = width++;

How do I tell JS to increment the CSS width by 1%?

elem.style.width = `${width++}%`;

I tweaked the code and this is what I have now

    elem.innerHTML = progress + "%"; //percentage
    elem.style.width = "${progress++}%"; //update progress value percentage

The JS code has completely stopped working. It won’t increment progress or width. What is going on? Can I please have a detailed explanation?

You should be using template literals. You need to be using back-ticks not quotation marks.

elem.style.width = `${progress++}%`;

hi friend try this code it will incress the progress bar width 1% in 1 second
var progress=document.getElementById(“myProgress”);
var myBar=document.getElementById(“myBar”);
function progressEvolution(a){
myBar.style.width=a+"%" ;
myBar.innerText=a+"%";
}
var width=0;
execute=setInterval(function(){
width++;
progressEvolution(width);
if(width >= 100){
clearInterval(execute);
}
},1000);

Thanks, it’s working now.