Display one element after another loads through JavaScript?

I'm trying to display an element only after another el开发者_JS百科ement is loaded. This is my code, but I can't seem to get it to work:

<script>
setTimeout(function() {
    document.getElementById('delayed_play').style.display = 'block';
}, 5 * 1000);   

function showHidden() {
document.getElementById("cantseeme").style.display='block';
      }
</script>

    <div id="delayed_play" onload="showHidden();" style="display:none;">     
    <object>
    <param name="src" value="http://linkimprov.com/buu.mp3">
    <param name="autoplay" value="true">
    <param name="autostart" value="true">
    <param name="controller" value="false">
    <embed onload="showHidden();" src="http://linkimprov.com/buu.mp3" controller="false" autoplay="true" autostart="True" type="audio/mp3" />
    </object> 
    <NOEMBED><BGSOUND SRC="buu.mp3" LOOP="2"></NOEMBED>
    </div>
        
    <div id="cantseeme" style="display: none">SOUND HAS STARTED</div>

Any ideas of why it isn't working?

A div element does not have an onload event.