Bootstrap Progressbar auto Update on trigger

by VENKATA VINAY BYSANI

HTML

<div class="container">
    <div class="progress progress-striped active">
        <div class="bar" style="width: 0%;"></div>
    </div>
</div>

CSS

@import url('//netdna.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css');
 .container {
    margin-top: 30px;
    width: 400px;
}

JavaScript

$(function () {
    var $bar = $('.bar');
    var percentage = 0;
    var numberOfFiles = 7;
    for(var count=0;count<numberOfFiles;count++){
        if ($bar.width() >= 400) {
            clearInterval(progress);
            $('.progress').removeClass('active');
        } else {
           //alert("");
            percentage += 100/numberOfFiles;
            $bar.css('width', (percentage)+'%');
        }
        
        $bar.text(percentage.toFixed(1) + "%");
    }
});