<html>
<head>
<script>
var persent = 0;
var addProgress = function(){
if(persent == 100){
clearInterval(addProgress);
return;
}
var child = document.getElementsByClassName('child');
child[0].style.width = persent + "%";
child[0].innerHTML = persent + "%";
persent++;
};
setInterval(addProgress, 100);
</script>
<style>
.parent{
width: 100%;
height: 30px;
}
.child{
background-color: green;
width: 0%;
height: 100%;
}
</style>
</head>
<body>
<div class="parent">
<div class="child"></div>
</div>
</body>
</html>