JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<div class="progress">
    <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>
</div>

<div class="alert alert-success" role="alert">Loading completed!</div>

CSS

.progress, .alert {
    margin: 15px;
}

.alert {
    display: none;
}

JavaScript

var $progress = $('.progress');
var $progressBar = $('.progress-bar');
var $alert = $('.alert');

$progressBar.animate({width: "100%"}, 100);
$progress.delay(1000).fadeOut(500);

setTimeout(function() {
  $progress.css('display', 'none');
  $alert.css('display', 'block');
}, 500);