JSFiddle - React, Tailwind, and code Playground

HTML

<div class='cell'>
    <div class='enquiry-button'></div>
</div>
<div class='cell'>
    <div class='enquiry-button'></div>
</div>
<div class='cell'>
    <div class='enquiry-button'></div>
</div>

CSS

.enquiry-button {
    border:solid 1px green;
    padding:1em;
}

JavaScript

$(".enquiry-button").click(function (e) {
    e.preventDefault();
    e.stopPropagation();
    var cell = $(this).closest('.cell');
    if (cell.find('.enquiry-form').length) {
        cell.find('.enquiry-form').slideToggle();
    } else {
        cell.append(
            "<div class='enquiry-form'>" +
            "<form>" +
            "Your Email: <input type='text' name='email'>" +
            "First name: <input type='text' name='firstname'>" +
            "<br>Last name: <input type='text' name='lastname'>" +
            "<br>Contact No: <input type='text' name='lastname'>" +
            "<br>Postcode: <input type='text' name='postcode'>" +
            "<br>Optional Comment: <input type='textarea' name='comment'>" +
            "<input type='submit' value='Submit'>" +
            "</form>" +
            "</div>");
        cell.find('.enquiry-form').hide().slideDown("slow");
    }
});