JSFiddle - React, Tailwind, and code Playground

by Keith Chu

HTML

<button>press me</button>
<div>
    lorem ipsum dolr sit lorem ipsum dolr sit lorem ipsum dolr sit lorem ipsum dolr sit lorem ipsum dolr sit 
</div>

CSS

div {
    overflow:hidden;
    background:#000;
    color:#fff;
    height:0;
    padding: 0 18px;
    width:100px;
    -webkit-transition: all .5s ease;
    -moz-transition: all .5s ease;
    transition: all .5s ease;
}
.animated {
    height:auto;
    padding: 24px 18px;
}

JavaScript

$('button').bind('click', function(e) { 
    e.preventDefault();
    
    $('div').toggleClass('animated');
});