Play and pause to play sound
<p>Im trying to have these 4 buttons, added in code to impliment a 5th one later, but you can ignore that one atm. What I want to have it is that when I click on one button it plays a sound, but if I click on a different one, it pauses the current sound and plays the new one. I dont seem to get it working.</p>

<p>CODE:</p>

<pre><code>&lt;audio id="sound1" src="monkey.mp3"&gt;&lt;/audio&gt;
&lt;audio id="sound2" src="sounds/sound2.mp3"&gt;&lt;/audio&gt;
&lt;audio id="sound3" src=".mp3"&gt;&lt;/audio&gt;
&lt;audio id="sound4" src=".mp3"&gt;&lt;/audio&gt;
&lt;audio id="sound5" src=".mp3"&gt;&lt;/audio&gt;

&lt;button onclick="playSound1()"&gt;Sound 1&lt;/button&gt;&lt;br /&gt;
&lt;button onclick="playSound2()"&gt;Sound 2&lt;/button&gt;&lt;br /&gt;
&lt;button onclick="playSound3()"&gt;Sound 3&lt;/button&gt;&lt;br /&gt;
&lt;button onclick="playSound4()"&gt;Sound 4&lt;/button&gt;&lt;br /&gt;
&lt;button onclick="playSound5()"&gt;Sound 5&lt;/button&gt;&lt;br /&gt;

&lt;script type="text/javascript"&gt;
var audio1 = document.getElementById('sound1');
var audio2 = document.getElementById('sound2');
var audio3 = document.getElementById('sound3');
var audio4 = document.getElementById('sound4');
function playSound1(){
if ((audio1.paused !== true) &amp;&amp; (audio.3paused !== true) &amp;&amp; (audio4.paused !==){
    audio1.pause();
    audio3.pause();
    audio4.pause();
    audio2.play();
    }
else{
    audio2.play();
    }
}
function playSound2(){
if (audio2.paused !== true){
    audio2.pause();
    audio3.pause();
    audio4.pause();
    audio1.play();
    }
else{
    audio1.play();
    }
}
function playSound3(){
if (audio2.paused !== true){
    audio2.pause();
    audio1.pause();
    audio3.pause();
    audio4.play();
    }
else{
    audio4.play();
    }
}
function playSound4(){
if (audio2.paused !== true){
    audio2.pause();
    audio4.pause();
    audio1.pause();
    audio3.play();
    }
else{
    audio3.play();
    }
}

&lt;/script&gt;
</code></pre>