onmouseover/out to change id using document.getElementById not working in IE6
I'm attempting to change a div tag's id value using onmouseover/onmouseout from another div element.
<a onmouseover="document.getElementById('main-clock').id='main-clock-jurassic'" onmouseout="document.getElementById('main-clock-jurassic').id='main-clock'" href="#"><div id="main-jurassic"> </div></a>
The div id tag i'm trying to change is main-clock.
WIth the code above, I'm able to effectively change the id tag of main-clock to main-clock-jurassic, and back again to main-clock. This works with Opera, Firefox and IE7, however, I'm buffled as to why it doesn't work in IE6.
Can any one kindly offer some guidance? I've tried searching for a solution to no avail and it is with last result that I consult you guys on this forum.
Any help wld be greatly appreciated.