JSFiddle - React, Tailwind, and code Playground

HTML

<div id="search">
  <div class="search__icon">
    
  </div>
</div>

CSS

#search{
  width: 150px;
  height: 50px;
  background-color: #ff0000;
}

#search.opened{
  background-color: #0000ff;
}

#search.opened .search__icon{
  background-color: #ffff00;
}

.search__icon{
  width: 50px;
  height: 50px;
  background-color: #00ff00;
}

JavaScript

$("#search").on("click", function(){
	$(this).toggleClass("opened");
});