JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li class="list-item">
        <a href="#">List 1</a>
    </li>
    <li class="list-item">
        <a href="#">List 2</a>
    </li>
    <li class="list-item">
        <a href="#">List 3</a>
    </li>
</ul>

CSS

ul {
    list-style-type: none;
    padding-left: 0px
}

ul li {
    display: none
}

JavaScript

$(function() {

    function slide($li) {
        if ($li.length == 0) return;
        $li.slideDown(500, function() {
            slide( $li.next(".list-item") );
        });
    }

    slide( $("ul li:hidden:first") );

});