simple responsive menu

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<div class="menucontainer">
  <a class="hamburger" href="#"><i class="fa fa-bars" aria-hidden="true"></i></a>
  <ul class="menu">
    <li><a href="#">Home</a></li>
    <li><a href="#">About us</a></li>
    <li><a href="#">Lorem</a></li>
    <li><a href="#">Ipsum</a></li>
    <li><a href="#">Contact</a></li>
  </ul>
</div>

CSS

/**/
.menucontainer{
  display: block;
  width: 100%;
  padding: 10px;
  background-color: #fff;
  border-bottom: 1px solid #2C97F3;
  position: relative;
}
.menu{
  display: inline-block;
  vertical-align: top;
  width: calc(100% - 48px);
}
.menu li{
  width: 20%;
}
.menu li a{
  display: inline-block;
  border: 1px solid #2C97F3;
  border-right: 0;
  font-size: 13px;
  color: #2C97F3;
  height: 55px;
  line-height: 55px;
  width: 100%;
  text-align: center;
}
.menu li:last-child a{
  border-right: 1px solid #2C97F3;
}
.menu li a:hover{
  background-color: #CD4B5B;
  color: #fff;
  border-color: #CD4B5B;
}
.hamburger{
  display: none;
}
/* Small devices (tablets, 768px and up) */
/*@media (min-width: 768px) {*/
  .menu{
    display: none;
    position: absolute;
    top: 100%;
    left: 0px;
    width: 100%;
  }
  .menu li{
    float: none;
    width: 100%;
  }
  .menu li a{
    width: 100%;
    border: 0px;
    border-bottom: #2C97F3;
    background-color: #fff;
  }
  .hamburger{
    color: #1c90f3;
    display: block;
    float: left;
    font-size: 32px;
    height: 55px;
    line-height: 55px;
    text-align: center;
    width: 40px;
  }
  .hamburger.click{
    background-color: #1c90f3;
    color: #fff;
  }
/*}*/

JavaScript

function openMenu(){
  $('.menu').slideDown();
  $('.hamburger i').removeClass('fa-bars');
  $('.hamburger i').addClass('fa-times');
}

function closeMenu(){
	$('.menu').slideUp();
  $('.hamburger i').removeClass('fa-times');
  $('.hamburger i').addClass('fa-bars');
}

$('.hamburger').click(function(){
  $(this).toggleClass('click');
  return $(this).hasClass('click') ? openMenu() : closeMenu();
});