title: Audio on mouseover
body: <p>It it working partially, but how do I get the below to work with multiple audio files:</p>
  
  <pre><code>    &lt;!DOCTYPE HTML&gt;
      &lt;html&gt;
      &lt;body&gt;
  
      &lt;script language="javascript" src="http://code.jquery.com/jquery-1.4.2.min.js"&gt;&lt;/script&gt;
  
      &lt;script type="text/javascript"&gt;
      $(function(){
          var birdhover     = $('.birds');
              var birdaudio = birdhover.find('audio')[0];
  
          birdhover.hover(function(){
             birdaudio.play();
          }, function(){
             birdaudio.stop();
          });
      });
      &lt;/script&gt;
  
      &lt;div class="birds" style="width:30px;height:30px;background-image:url(image1.gif');cursor:pointer;"&gt;
         &lt;audio src="sound1.ogg" preload="auto"&gt;&lt;/audio&gt;
      &lt;/div&gt; 
  
      &lt;div class="birds" style="width:30px;height:30px;background-image:url('/home/imran/Desktop/images/vowel_short_2.gif');cursor:pointer;"&gt;
  (image2.gif');cursor:pointer;"&gt;
         &lt;audio src="sound2.ogg" preload="auto"&gt;&lt;/audio&gt;
      &lt;/div&gt; 
  
      &lt;/body&gt;
      &lt;/html&gt;
  </code></pre>
  
  <p>Both images play the same sound.</p>