Your code is working correctly, but offsetWidth
returns the physical pixel width of the element on the screen. Since you're doing a strict equality comparison using ===
, the if()
block never evaluates to true; offsetWidth
returns an integer to start, and will never append the %
value.
For example, see this jsFiddle demo -- the <input />
's value becomes an integer.
If you absolutely need to have the width as a percentage value, you'll need to access the element's CSS definitions using the HTMLElement.style
property as follows:
document.getElementsByClassName("progress-bar")[0].style.width;
jsFiddle Demo
Ultimately, your if()
block will become:
if( document.getElementsByClassName("progress-bar")[0].style.width == '100%' )
{
clearInterval(r1);
clearInterval(r2);
clearInterval(r3);
}