JSFiddle - React, Tailwind, and code Playground
HTML
<div class="element" data-order="2">Div 2</div>
<div class="element" data-order="1">Div 1</div>
<div class="element" data-order="3">Div 3</div>
CSS
.element {
display: none;
border: 1px solid red;
height: 4rem;
line-height: 4rem;
margin: 2rem;
text-align: center;
height:1000px;
}
JavaScript
var ordered = [], $el, i, order;
var $elements = $('.element');
$elements.each(function() {
var o = parseInt($(this).attr('data-order'), 10);
ordered.push(o);
});
ordered.sort();
for (i = 0; i < ordered.length; i++) {
order = ordered[i];
$el = $('.element[data-order='+order+']');
$el.delay(order * 500).fadeTo(1000, 1);
}