JSFiddle - React, Tailwind, and code Playground

HTML

<div id='cont' style="border: 1px solid #000; height: 150px; overflow:hidden;">
    <a href="#" id="button">Mostrar Todo</a>
    <ul>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li> 
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
		 <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>
        <li>an item</li>

    </ul>
</div>

JavaScript

$('#button').click(function(){
    $('#cont').animate({height:'500px'}, 500);
    //this method increases the height to 72px
});