Change a span id, not rewrite the page?

[Stevee]

Hi all you brill javascripters, I have a problem (obviously) I have a Div with a couple of spans to control a music file, onload the music file plays with a "Pause Music" link in control.

<span id="MusicOn" class="Music" OnClick="document.all.MusicOff.style.display='inline'; MusicOn.style.display='none'; javascript:document.getElementById('music').Play(); setTimeout('PlayButton()',15000);">Play Music</span id="MusicOn">

<span id="MusicOff" class="Music" OnClick="document.all.MusicOn.style.display='inline'; MusicOff.style.display='none'; javascript:document.getElementById('music').Stop();">Pause Music</span id="MusicOff">

After 15 seconds the music will be finished and I want to replace the pause link with a play link, the "PlayButton" javascript uses a setTimeout and a document.write control which obviously runs but clears the html page and I need to add/change the current page.
Anybody with any help would be appreciated.

[DanInMA]

You'll need to post an example of the script itself.

[Stevee]

Der, Sorry,

The script -

function PlayButton()
{
output = "self"
output.write("<span id=\"MusicOn\" class=\"Music\" OnClick=\"document.all.MusicOff.style.display='inline'; MusicOn.style.display='none'; javascript:document.getElementById('music').Play(); setTimeout('PlayButton()',15000);\">Play Music</span id=\"MusicOn\">")
}

Obviously I have tried document.write but get a new page.

[007Julien]

It's strange to repeat the id with the closing tag ? See this page