Hiding audio play buttons

[Mike in Canada]

Thanks Acorn, you are another fantastic contributor btw.

[siran]

Thanks Acorn, but please keep in mind that you have got me started.
Javascript is quite easy to learn because you can find everything about it on the net and you only need a text editor and a browser to experiment with it.

[cneal007]

Siran I Appreciate your help with this and i'm gonna pose a complicated problem to you as you seem better well versed in this and I hope you can help.
I used a different method to get the audio to work correctly & now it seems to overwrite and break all of my popups for menus and such.
Both the audio and the image button used to play the audio are hosted of site and called in but only when the script to call in the button does it break everything else.

Script for audio is required in two places one in the body of the page and another for the image button
body of page script

<script>
var sounds = [
	"http://MySiteAt.com/audio/index_htm_files/Generic%20Audio%20File.mp3",
	"http://MySiteAt.com/audio/index_htm_files/Generic%20Audio%20File.mp3"],
    oldSounds = [];

var playSound = function() {
    
    var index = Math.floor(Math.random() * (sounds.length)),
        thisSound = sounds[index];
    
    oldSounds.push(thisSound);
    sounds.splice(index, 1);
    
    if (sounds.length < 1) {
        sounds = oldSounds.splice(0, oldSounds.length);
    }
    
    var $source = $('source')[0];
    var $audio = $('audio')[0];
    
    $source.src = thisSound;
    $audio.load();
    $audio.play();
    
};
</script>

Script to add button and call for audio on mobile device (I have narrowed it down to this as the culprit in breaking the popups)

<a href="javascript:playSound()">    
<img id="img_audio" src="http://textingcloud.net/images/listennow.png" width="273px" height="91px" id="ImageButton1">
</a>
    <div id="element">
		<audio preload="auto">
            <source type="audio/mp3" />
		</aud

The site requires several popups and even has a popup appear when first loaded using a website body script and hidden widget link
Hidden popup Website body code

<script type="text/javascript">xr_v1(document.getElementById('mypopup1').parentNode.parentNode)</script>

Site with working popups minus the play audio code
http://mysiteat.com/popups-work/http://

Site when play audio button code inserted (working) and popups broken
http://mysiteat.com/sound-works/

Maybe you can see where ive gone wrong or maybe you know of an easier way. I know its a lotsound-working-popups-broke.webpopup-working.web so thanks in advance