JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
<p>Lorem ipsum dolor sit amet ...</p>
<p>Lorem ipsum dolor sit amet ...</p>
<p>Lorem ipsum dolor sit amet ...</p>
<p>Lorem ipsum dolor sit amet ...</p>
</div>
<p><button id="switch_p">Toggle p</button> <button id="up_p">Up p</button> <button id="down_p">Down p</button></p>
<p><button id="switch_container">Toggle container</button></p>

CSS

#container {
    border:1px solid red;
    padding:5px;
}
#container p {
    background:yellow;
    padding:5px;
    margin:5px;
}

JavaScript

$(document).ready(function() {
    $('#switch_p').click(function() {
        $('#container p').slideToggle();
    });
    $('#up_p').click(function() {
        $('#container p').slideUp();
    });
    $('#down_p').click(function() {
        $('#container p').slideDown();
    });
    $('#switch_container').click(function() {
        $('#container').slideToggle();
    });
});