title: Condensing jQuery script
body: <p>Looking to condense the jQuery I have here into a few lines, I know it can be done but I can't seem to get it to work looking at other posts and round the web... </p>
  
  <p>HTML</p>
  
  <pre><code>         &lt;h2&gt;Meet The Team&lt;/h2&gt;
       &lt;img src="img/1.png" id="team" class="team" /&gt;
       &lt;img src="img/1.png" id="team1" class="team" /&gt;
       &lt;img src="img/1.png" id="team2" class="team" /&gt;
       &lt;img src="img/1.png" id="team3" class="team" /&gt;
       &lt;img src="img/1.png" id="team4" class="team" /&gt;
       &lt;img src="img/1.png" id="team5" class="team" /&gt;
  
       &lt;div id="teamintro" class="teamintro"&gt;
           &lt;h3&gt;Matt&lt;/h3&gt;
           &lt;p&gt;personal intro &lt;/p&gt;
       &lt;/div&gt;
  
      &lt;div id="teamintro1" class="teamintro"&gt;
           &lt;h3&gt;Garrett&lt;/h3&gt;
           &lt;p&gt; &lt;/p&gt;
      &lt;/div&gt;
  
      &lt;div id="teamintro2" class="teamintro"&gt; 
           &lt;h3&gt;Erik&lt;/h3&gt;
           &lt;p&gt; &lt;/p&gt;            
      &lt;/div&gt;
  
      &lt;div id="teamintro3" class="teamintro"&gt;
           &lt;h3&gt;Matt&lt;/h3&gt;
           &lt;p&gt; &lt;/p&gt;
      &lt;/div&gt;
  
      &lt;div id="teamintro4" class="teamintro"&gt; 
           &lt;h3&gt;Chi&lt;/h3&gt;
           &lt;p&gt; &lt;/p&gt;
      &lt;/div&gt;
  
      &lt;div id="teamintro5" class="teamintro"&gt; 
           &lt;h3&gt;Daemon&lt;/h3&gt;
           &lt;p&gt; &lt;/p&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>jQuery</p>
  
  <pre><code>&lt;script&gt;
      $(document).ready(function() {
  
          $('.teamintro').hide();
  
          $('#team').hover(function() {
              $('#teamintro').fadeIn(600);
          },
          function(){
              $('#teamintro').hide();
          });
  
           $('#team1').hover(function() {
                  $('#teamintro1').fadeIn(600);
           },
               function(){
                  $('#teamintro1').hide();
          });
  
           $('#team2').hover(function() {
                  $('#teamintro2').fadeIn(600);
           },
               function(){
                  $('#teamintro2').hide();
          });
  
           $('#team3').hover(function() {
                  $('#teamintro3').fadeIn(600);
           },
               function(){
                  $('#teamintro3').hide();
          });
  
           $('#team4').hover(function() {
                  $('#teamintro4').fadeIn(600);
           },
               function(){
                  $('#teamintro4').hide();
          });
  
           $('#team5').hover(function() {
                  $('#teamintro5').fadeIn(600);
           },
               function(){
                  $('#teamintro5').hide();
          });
  
      });
  
  
   &lt;/script&gt;
  </code></pre>
  
  <p>So what I am looking to do it to get the persons info to appear when you hover over the image of the said person. </p>