JSFiddle - React, Tailwind, and code Playground

HTML

<div class="d">Slide UP</div>
<div class="fd">Fade Out</div>
<p>rgergeerggereggeeregrgregrgre<br/>rgergeerggereggeeregrgregrgre<br/>rgergeerggereggeeregrgregrgre<br/>
    rgergeerggereggeeregrgregrgre<br/>rgergeerggereggeeregrgregrgre</p><h1> Extra paragraph text</h1>

CSS

div{background-color:#000;color:#FFF;padding:5px;margin:3px;}

JavaScript

$('.d').click( function(){
    if($('p').is(":visible")){
    	$('p').slideUp(800);
        setTimeout(function() { $('.d').text('Slide Down'); },900);
    }else{
    	$('p').slideDown(800);
        setTimeout(function() { $('.d').text('Slide Up'); }, 900);
    }	
});