title: Trying to make theme dropdown menu OnClick instead of hover
body: <p>[Sorry if this is a dup to anyone, I was asked by the admins to move it to overflow]</p>
  
  <p>I'm using the DIVI theme and making some relatively simple modifications to it to better suit my needs. One thing I'm having some difficulty with though surprisingly is swapping out its vertical menu's hover state drop downs to onclick functionality.</p>
  
  <p>I've put together an example of the code below here: <a href="http://jsfiddle.net/jdcutter/4aLu7nvp/5/">JSFIDDLE</a></p>
  
  <pre><code>$('ul.top-menu').children('.menu-item-has-children').click(function(){
      $(this).children('.sub-menu').slideToggle('slow');
  }).children('ul').find('.menu-item').click(function (event) { //select all the `.child` elements and stop the propagation of click events on the elements
      event.stopPropagation();
      return false;
  });
  </code></pre>
  
  <p>Oddly, though I can't seem to remove the hover state functionality from the menu. An example of DIVI can be found here: <a href="http://www.elegantthemes.com/demo/?theme=Divi">DIVI</a></p>
  
  <p>Note: You'll need to go to headers in the navigation and choose the dark vertical navigation to replicate my layout.</p>
  
  <p>Thanks in advance for your thoughts!</p>