Q:

problem with accessing getElementById using javascript

I have this code and i don't know why it doesn't function
<html>
<head>
<title>Test</title>
<script type="text/javascript">
function StopBackgroundMusic()
{
var MusicObj = document.getElementById("BackgroundMusic");

MusicObj.data = "http://www.oreillynet.com/examples/oreilly/digitalmedia/2005/02/ableton_intro_0205_gtr.mp3";
MusicObj.autoplay = "false";
MusicObj.autostart = "false";

return MusicObj;
}
</script>
</head>
<body>

<OBJECT ID="BackgroundMusic" data="http://www.oreillynet.com/examples/oreilly/digitalmedia/2005/02/ableton_intro_0205_gtr.mp3" TYPE="audio/mpeg" height="0" width="0">
<PARAM NAME="autostart" VALUE="true">
<PARAM NAME="autoplay" VALUE="true">

</OBJECT>

<form> 

<input type='button' onclick='StopBackgroundMusic()' value='Stop music'/>

</form> 
</body>
</html>

A:

Try setting data to null instead of setting the music URL again.
Another alternative is removing the object node when you press the stop button:
function StopBackgroundMusic()
{
    var MusicObj = document.getElementById("BackgroundMusic");
    MusicObj.parentNode.removeChild(MusicObj);
}

