JSFiddle - React, Tailwind, and code Playground

HTML

<div class="loading"></div>

CSS

.loading div {
    opacity: 0;
    border: 1px #a6a6a6 solid;
    box-shadow: inset 0px 0px 3px #000;
    -moz-box-shadow: inset 0px 0px 3px #000;
    -webkit-box-shadow: inset 0px 0px 3px #000;
    background-color: #ebebeb;
    float:left;
}

JavaScript

function loadingShow(obj, time){
    obj.animate({'opacity': 1}, time, function(){
        loadingHide(obj, time);
    });
}

function loadingHide(obj, time){
    obj.animate({'opacity': 0.3}, time, function(){
        setTimeout(function(){
            loadingShow(obj, time);
        }, 500);
    });
}

setInterval(function(){
    $('.loading').each(function(){
        var obj = $(this);
        if(obj.children('div').length>0) return;
        var w = 30;
        var h = 50;
        obj.append('<div style="width:'+w+'px;height:'+h+'px"></div>');
        obj.append('<div style="width:'+w+'px;height:'+h+'px"></div>');
        obj.append('<div style="width:'+w+'px;height:'+h+'px"></div>');
        obj.append('<div style="clear:both"></div>');
        var i = 0;
        var time = 100;
        obj.children('div').each(function(){
            i++;
            var obj = $(this);
            setTimeout(function(){
                loadingShow(obj, time*2);
            }, i*time);
        });
    });
}, 100);