Jquery help with left tab menu
<p>This really should not be this complicated, but can't figure it out.</p>

<p>Have several tabs vertically on the left along the body content section.</p>

<p>On page load, the "leftKanji" css = display:none.  Want when mouse enters the link or "leftTab" class, then "leftKanji" css = disply:block</p>

<p>Currently either all the "leftKanji" shows or hides, not the one the mouse is hover over with.  Bonus would be if I can add a "slow" or animate to it.</p>

<p>HTML:</p>

<pre><code>&lt;script type="text/javascript" &gt;
$(document).ready(function(){
    $('.leftTab').hover( function(){
      $(".leftKanji").css('display', 'block');
   },
   function(){
      $(".leftKanji").css('display', 'none');
   });
});
&lt;/script&gt;
&lt;div class="mainTabSection"&gt;
   &lt;a href="#" class="leftTab"&gt;
     &lt;div class="mainTab"&gt;&lt;img src="../"  /&gt;&lt;/div&gt;
     &lt;div class="leftKanji"&gt;&lt;img src="../"  /&gt;&lt;/div&gt;
   &lt;/a&gt;
&lt;/div&gt;

&lt;div class="mainTabSection"&gt;
   &lt;a href="#" class="leftTab"&gt;
     &lt;div class="mainTab"&gt;&lt;img src="../"  /&gt;&lt;/div&gt;
     &lt;div class="leftKanji"&gt;&lt;img src="../"  /&gt;&lt;/div&gt;
   &lt;/a&gt;
&lt;/div&gt;
</code></pre>
