JSFiddle - React, Tailwind, and code Playground

HTML

<div id="main">
    <div id="search">
        <form method="get">
            <label>Define:</label>
            <input type="text" id=""></input>
            <button>Go</button>
        </form>
    </div>
</div>

JavaScript

jQuery.fn.center = function() {
    this.css("position", "absolute");
    this.css("top", (($(window).outerHeight() - this.outerHeight()) / 2) + $(window).scrollTop() + "px");
    this.css("left", (($(window).outerWidth() - this.outerWidth()) / 2) + $(window).scrollLeft() + "px");
    return this;
};

$(document).ready(function() {
    $("div#main").center(true);

    $('form button').on('click', function() {
        $("div#main").append("<p>stuff</p>");
        return false;
    });
});