JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <div>
    <div>
      <div>
        <div>
          <div>
            <div>
              <div>
                <div>
                  <div>
                    <div></div>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

CSS

div {
    background: rgba(87, 24, 156, .2);
    padding: 20px;
}

div div {
    opacity: 0;
}

JavaScript

$.fn.cascadeChildren = function (speed) {
    var $children = this.children();

    if ( ! $children.length ) return;
    
    speed = speed || 300;
    
    $children.animate({ opacity: 1 }, speed, function () {
        $(this).cascadeChildren(speed);
    });
};

$(document.body).find('> div').cascadeChildren(1000);