JSFiddle - React, Tailwind, and code Playground

by roXon

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>

JavaScript

$(document).on("click", "button.js-btn-toggle_search", function(){
    var $input = $("input.inputSearch");
    var tog = $input.css("visibility") === "visible";
    $input.css({visibility: tog ? "hidden" : "visible"});
    $(this).text(tog ? "Search" : "X Close");
});