JSFiddle - React, Tailwind, and code Playground

HTML

<form id="test" action="#" method="POST">
    <ul class="items">
        <li>
            <button class="show-content-button">Show</button>
            <div class="form-content ui-helper-hidden">
                Hello
            </div>
        </li>
        <li>
            <button class="show-content-button">Show</button>
            <div class="form-content ui-helper-hidden">
                Hello
            </div>
        </li>
        <li>
            <button class="show-content-button">Show</button>
            <div class="form-content ui-helper-hidden">
                Hello
            </div>
        </li>
    </ul>
</form>

JavaScript

$(function() {
        $("#test").submit(function() {
            alert("hello i have been submitted");
        })
        $(".show-content-button").click(function() {
            alert('click1');
            var $button = $(this);
            if ($button.text() === "Show") {
                alert('show');
                $(".form-content", $button.parent()).fadeIn(400);
                $button.html("Hide");
                alert('show2');
            } else if ($button.text() === "Hide") {
                $(".form-content", $button.parent()).fadeOut(200);
                $button.html("Show");
            }
        })
    })