JSFiddle - React, Tailwind, and code Playground

HTML

<button id="hide">Write me </button>
<div id="par">
<p>
<input type="email" name="email" id="email" placeholder="email" autofocus required>
</p>
<p>
    <input type="text" name="subject" id="name" placeholder="subject" autofocus required>
</p>
<p>
    <input type="text" name="message" id="message" placeholder="message" autofocus required>
</p>
<p>
    <input type="submit" name="send" id="send" value="Send">
</p>
</div>

CSS

#par{display:none;}

JavaScript

$(document).ready(function () {
    $('#hide').on('click', function () {
        if ($('#par').is(':visible')) {
            $(this).text('Write me');
            $('#par').hide();
        } else {
            $(this).text("I don't want to write any message now.");
            $('#par').show();
        }
    });
});