JSFiddle - React, Tailwind, and code Playground

HTML

<!-- Header -->
<div id="js-header" class="b-header">
    <div class="wrap">
        <div class="b-header_container">
            <div class="navbar-left">
               <div class="b-header_search">
                 <div class="b-header_btn-search">
                    <a class="btn-search" href="#" onclick="showWindow()">Search</a>
                        <span class="btn-search_icon"></span>
                 </div>
               </div>
            </div>
            <div class="navbar-right">
                    <div class="b-header_btn-reg">
                        <a class="btn-reg" href='#'>Registration</a>
                    </div>
                    <div class="b-header_btn-login">
                        <a class="btn-login" href='#'>Log in</a>
                    </div>
            </div>
    </div>
    </div>
</div>
<!-- Content -->
<div id="js-content" class="b-content">
    <div class="wrap">
      <div class="b-content_actions">
          <div class="slogan1">
              <h3>Text1</h3>
          </div>
      </div>
    </div>
</div>

JavaScript

function showWindow()
{
    if($(".b-content_actions").is(":visible"))
    {
        $( ".b-content_actions" ).hide();
    
        $('<div class="bbb">Какой-то блок <a href="#" onclick="closeWindow()">Закрыть</a></div>').insertBefore($(".b-content_actions"));
    }
}
function closeWindow()
{
    $(".bbb").remove();
    
    $( ".b-content_actions" ).show();
}