title: jQuery if element has class add class to 'this'
body: <p>I am trying to make a menu where if a user hovers on 'menuItem' it will only show the submenu for that specific element.</p>
  
  <p>I know you can use $(this) but in the jQuery when i change</p>
  
  <pre><code>$(subMenu).removeClass("hide-submenu").addClass("show-submenu");
  </code></pre>
  
  <p>to</p>
  
  <pre><code>$(this).removeClass("hide-submenu").addClass("show-submenu");
  </code></pre>
  
  <p>It doesnt seem to work</p>
  
  <pre><code>var menuItem = $("nav &gt; ul &gt; li &gt; a");
  
  var subMenu = $("ul &gt; li &gt; ul");
  
  
  $(subMenu).addClass("hide-submenu");
  
  $(menuItem).hover(function(){
  if($(subMenu).hasClass("hide-submenu")) {
          $(subMenu).removeClass("hide-submenu").addClass("show-submenu");
  }
  else {
          $(subMenu).removeClass("show-submenu").addClass("hide-submenu");
  }
  });
  </code></pre>
  
  <p>Below is my HTML</p>
  
  <pre><code>&lt;nav&gt;
      &lt;ul&gt;
          &lt;li&gt;
              &lt;a&gt;MENU ITEM&lt;/a&gt;
                  &lt;ul&gt;
                      &lt;li&gt;&lt;a href="#"&gt;SUB ITEM 1&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;SUB ITEM 2&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;SUB ITEM 3&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt;
          &lt;/li&gt;
  
      &lt;/ul&gt;
  &lt;/nav&gt;
  </code></pre>