JSFiddle - React, Tailwind, and code Playground

HTML

<div class="bar" data-percent="100"></div>
<div class="bar" data-percent="800"></div>
<div class="bar" data-percent="60"></div>
<div class="bar" data-percent="10"></div>
<div class="bar" data-percent="100"></div>

CSS

div {
    display:none;
    background: #AAF;
    width:10px;
    height:20px;
    border:#000 solid 1px;
}

JavaScript

var animate = function (el) {
    return function () {
        var widthpercent = el.data('percent');
        el.fadeIn();
        el.animate({
            width: widthpercent
        }, 500);
    }
}
var bars = $('.bar');
bars.each(function (index) {
    var $this = $(this);
    setTimeout(animate($this), index * 500);
});