JSFiddle - React, Tailwind, and code Playground

by alvaroveliz

HTML

<button class="button">Show!</button>
<div id="message">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quasi at corporis dolores quia dignissimos voluptates adipisci praesentium temporibus voluptatum labore natus necessitatibus autem consectetur eum perferendis quos accusantium nam molestias?
</div>

CSS

.button {
    font-size: 20px;
}

#message {
    display: none;
    padding: 10px;
    background: #EEE;
}

JavaScript

$(document).ready(function(){
    $('.button').click(function(){
        if ($('#message').is(':hidden')) { $(this).html('Hide!'); }
        else { $(this).html('Show!'); }
        
        $('#message').toggle('slide');
    });
});