Hi, I was wondering if someone could show me a way to stop an existing instance of a sound file when another is called -- ie. only one sound file playing at a time.

Here some code I played with to call multiple sound files on a page...

HTML Code:
<!DOCTYPE html>
<html>
<body>

<audio id="1"> 
  <source src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.mp4" type='audio/mp4'> 
  <source src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.oga" type='audio/ogg; codecs=vorbis'>
  Your user agent does not support the HTML5 Audio element.
</audio>

<audio id="2"> 
  <source src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.mp4" type='audio/mp4'> 
  <source src="http://media.w3.org/2010/07/bunny/04-Death_Becomes_Fur.oga" type='audio/ogg; codecs=vorbis'>
  Your user agent does not support the HTML5 Audio element.
</audio>


<button type="button" onclick="aud_play_pause('1')">Listen</button>
<button type="button" onclick="aud_play_pause('2')">Listen</button>

<script>

function aud_play_pause(idNumber) {
  var idNumber = document.getElementById(idNumber);
  if (idNumber.paused) {
    idNumber.play();
  } else {
    idNumber.pause();
  }
}

</script>


</body>
</html>
I guess I could put my ids in a array and then iterate through them calling stop() on each one (before playing the selected audio file), but perhaps there is an easier way?

Thanks.