title: Jquery $(this) Child Selector Not working for some unknown reason
body: <p>I am trying to show/hide the child class when parent is hovered. I have multiple class set like in <a href="https://stackoverflow.com/questions/841553/jquery-this-child-selector">Jquery $(this) Child Selector</a>.</p>
  
  <p>for some unknown reason it is not working.</p>
  
  <p>What I have is</p>
  
  <pre><code>&lt;div class="parentitem"&gt;
      &lt;div class="childitem"&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Also</p>
  
  <pre><code>$("div.childitem").css({visibility: "hidden"});
  
  $("div.parentitem").mouseenter(function(){
      $("div.childitem").css({visibility: "visible"});
  });
  
  $("div.parentitem").mouseleave(function(){
      $("div.childitem").css({visibility: "hidden"});
  });
  </code></pre>
  
  <p>This works but all the children are affected. What I wanted is to affect only particular div and its child</p>
  
  <p>I tried to use</p>
  
  <pre><code>$(this).children("div.childitem").css({visibility: "visible"});
  
  $(this).parent().children("div.childitem").css({visibility: "visible"});
  
  $(this).next("div.childitem").css({visibility: "visible"});
  </code></pre>
  
  <p>None of this is working for some reason. </p>
  
  <p>Can somebody point me where I went wrong.</p>
  
  <p>Thanks</p>
  
  <p>Deepak</p>