title: jquery hide/show on mouse over works only for one div
body: <p>I have several div's floated left, and each havea CHILD DIV which should hide on mouse over. It works only for first container/parent div. for other it doesn't.</p>
  
  <p>I am looking to achive, when mouseover parent DIV child div hides, on mouseout child div appears. and this shouls work for all containers/parent div's, *i am not looking for when hover any of div1 hide all div2 :). function must work for each container in part.</p>
  
  <p><a href="http://jsfiddle.net/T7USy/10/" rel="nofollow">FIDDLE</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="div1"&gt;
      &lt;div id="div2"&gt;asdsds&lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="div1"&gt;
      &lt;div id="div2"&gt;asdsds&lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="div1"&gt;
      &lt;div id="div2"&gt;asdsds&lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="clear"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>jQuery:</p>
  
  <pre><code>$(function() {
        $('#div2').show();
        $('#div1').hover( function() { $('#div2').fadeToggle(); } );
  });
  </code></pre>
  
  <p>Please help!</p>