Jquery code doesn't work for vertical menu..Please help me!


#1

<div id="nav">
 <div class="container group">
      <div class="whiteBox0"></div>
       <div class="blackBox0"></div>
      <div class="whiteBox1"><a href="#"><li class="port">Portfolio</li></a></div>
      <div class="blackBox1"><a href="#"><li class="gall active">Gallery<i class="icon right fa fa-angle-down" aria-hidden="true"></i></li></a></div>
            <ul class="drop">
              <li><a href="#">Documentary</a></li>
              <li><a href="#">Portraits</a></li>
              <li><a href="#">Nature</a></li>
            </ul>

$(document).ready(function() {
  $('.container li:has (ul)').click(function(e){
    e.preventDefault();

    if ($(this).hasClass('active')) {
      $(this).removeClass('active');
      $(this).children('ul').slideUp();
    } else {
      $('.container li ul a').slideUp();
      $('.container li').removeClass('active');
      $(this).addClass('active');
      $(this).children('ul').slideDown();
    }
  });
});