Progressbar

<!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
</head>
<body>
<div class="progress progress-striped active">
  <div class="bar" id="p_bar" style="width: 0%; color: red"></div>
</div>
<p id="numericProgress">0% Done</p>
<script type="text/javascript">
    var val = 0 ;

    setInterval(progress, 750)

    function progress(){
        var p_bar = document.getElementById('p_bar');

        progress = Math.floor((Math.random() * 5) + 1);
        val = val + progress;
        if(val >= 100){
            val = 0;
        }

        p_bar.style.width = val + '%';

        var numericProgress = document.getElementById('numericProgress');
        numericProgress.innerHTML = val + '% Done' ;


    }
</script>
</body>
</html>