JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>
        li 1
    </li>
    <li>
        li 2
    </li>
    <li>
        li 3
    </li>
</ul>

CSS

ul.hide {
    max-height: 0px;
    overflow: hidden;
}
ul{max-height:999px;border:1px solid blue}
ul {
    -webkit-transition: all 1s ease-in-out;
    -moz-transition: all 1s ease-in-out;
    -o-transition: all 1s ease-in-out;
    -ms-transition: all 1s ease-in-out;
    transition: all 1s ease-in-out;
}

JavaScript

setTimeout(function () {$('ul').addClass('hide');}, 2000);
setTimeout(function () { $('ul').removeClass('hide'); }, 4000);