JSFiddle - React, Tailwind, and code Playground

HTML

<div id="progressBar">bar</div>
<div id="progressBarFull"> &nbsp;</div>
<button id="btn" type="button">enlarge</button>

CSS

#progressBar {
    position: fixed;
    height: 20px;
    width: 0px;
    background-color: red;
z-index: 10;    
}
#progressBarFull {
    position: fixed;
    height: 20px;
    width: 100px;
    background-color: gray;    
}
#btn {
      position: fixed;
    top: 100px;  
    
}

JavaScript

$( "#btn" ).click(function() {
    var curSize = $("#progressBar").width();
    var fullSize = $("#progressBarFull").width();
    if(curSize < 100) {
        var increment = fullSize/ 10;
   $("#progressBar").css('width', '+=' + increment);
    }
});