I am working on a Videos page where my intention is to load a video with the page but by clicking a link, the original video will be updated and replaced with the corresponding video.

For instance, if video1 loads with the page and the user clicks to view video2, the original div's innerHTML holding video1 is updated to play video2.

Now, I have works great in IE and Chrome but nothing loads at all in Firefox. Below are some snippets of my code. Any idea how to load these videos in a manner that Firefox supports?

Javascript Function

function updateVideo(arraynum) {
var arraynum;
var vidId = document.anchors(arraynum).name;    
  document.getElementById("movieDiv").innerHTML = "<object width='340' height='300'><param name='movie' value='http://www.youtube.com/v/" + vidId + "&h1=en&fs=1&color1=0x5d1719&color2=0xcd311b'></param><param name='wmode' value='opaque'></param><embed src='http://www.youtube.com/v/" + vidId + "&h1=en&fs=1&color1=0x5d1719&color2=0xcd311b' type='application/x-shockwave-flash' wmode='opaque' width='340' height='300'></embed></object>";

Html

<div id = "movieDiv">

        </div>

Links

<a name="-MQf_Ol00nk" href = "#" onclick="updateVideo(4)"><img src="../images/content/videos/kaleidoscope/2010/May/Arts-and-Events.jpg" border = "0"></a>

Any help with this issue would be greatly appreciated.

And on a smaller note, every time a link in clicked in IE, a '#' is added into the title bar. So clicking three or four videos would result in the page title being followed up with three or four # signs.