JSFiddle - React, Tailwind, and code Playground

HTML

<div class="main-search-continer">
         <form action="/content/testing.html">
            <input class="inputSearch" size="41" maxlength="2048" name="q" value="">
            
            <button type="button" class="js-btn-toggle_search">X Close</button>
         </form>
         <div class="clear"></div>
      </div>

CSS

.button-fixed {
    margin-left: 286px;
}

JavaScript

$(document).on("click", "button.js-btn-toggle_search", function(){
    	var $btn = $(this)
        $("input.inputSearch").toggle(0, '', function() {
            if($(this).is(":visible")) {
            	$btn.text("X Close");
                $btn.removeClass("button-fixed");
            } else {
    			$btn.text("Search");
                $btn.addClass("button-fixed");
            }
        })
    })