JSFiddle - React, Tailwind, and code Playground

HTML

<div id="mobile-menu" class="mobile-menu">
	<span></span>
</div>

CSS

.mobile-menu {
  overflow: hidden;
  width: 36px;
  height: 27px;
  cursor: pointer;
}
.mobile-menu span {
  display: block;
  height: 6px;
  margin-top: 10px;
  width: inherit;
  position: relative;
}
.mobile-menu span, .mobile-menu span:after, .mobile-menu span:before {
  background: #000;
  border-radius: 5px;
}
.mobile-menu span:after, .mobile-menu span:before {
  width: inherit;
  content: "";
  height: inherit;
  position: absolute;
}
.mobile-menu span:after {
  top: -10px;
}
.mobile-menu span:before {
  bottom: -10px;
}

JavaScript

var menu = document.getElementById("mobile-menu");

menu.onclick = function(){
	alert("you clicked the menu");
}