Need Cross-Browser Capable Menu / Script - event.srcElement to getElementById

I have been using a public domain tree menu that is unfortunately IE specific. I need to make it multi-browser compatibile, but due to its use in an application, need to minimize the code changes if possible. Really, because of its deployment, I need to work with only newer browsers, most likely IE and Firefox.

From what I've read, I believe the problem / solution revolves around replacing the "event.srcElement.id" parts with the "get.ElementById" equivalents, but haven't had very consistent results so far.

I have found similar menus with updated elements, including this forum, but I am very new to JavaScript and am having problems making the switch fit in with what I already have. Also, the example I found in this forum appeared to have a different HTML component not using Lists the same way I am. It seems to me that it should not be too difficult, but my attempts so far have not been successful.

Thanks ahead of time for any and all help!

Here is the script, part in Blue being the issue:

if(document.all && !document.getElementById) {
document.getElementById = function(id) {
return document.all[id];
}
}

var head="display:''"
img1=new Image()
img1.src=http://www.codingforums.com/archive/index.php/"fold.gif"
img2=new Image()
img2.src=http://www.codingforums.com/archive/index.php/"open.gif"

function change(){
if(!document.all)
return
else {
if (event.srcElement.id=="foldheader") {
var srcIndex = event.srcElement.sourceIndex
var nested = document.all[srcIndex+1]
if (nested.style.display=="none") {
nested.style.display=''
event.srcElement.style.listStyleImage="url(open.gif)"
}
else {
nested.style.display="none"
event.srcElement.style.listStyleImage="url(fold.gif)"
}
}
}
}

document.onclick=change

---------------------------------------------------------------------
Here is the associated generic HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>Menu</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link rel="stylesheet" type="text/css" href=http://www.codingforums.com/archive/index.php/"menu.css" />

</head>

<body>

<script type="text/javascript" src=http://www.codingforums.com/archive/index.php/"menu.js"></script>

<div class=navmenu id="box1" style="z-index:2">
<ul>
<li id="foldheader">News</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.google.com">Google</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.yahoo.com">Yahoo</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.abcnews.com">ABC News</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.vancouversun.com">Vancouver Sun</a></li>
</ul>

<li id="foldheader">Games</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.gamespot.com">GameSpot</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.happypuppy.com">Happy Puppy</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.gamecenter.com">Game Center</a></li>
</ul>

<li id="foldheader">Software</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.download.com">outer 1</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.hotfiles.com">outer 2</a></li>
<li id="foldheader">Nested</li>
<ul id="foldinglist" style="display:none" style=&{head};>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.windows95.com">nested 1</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.shareware.com">nested 2</a></li>
</ul>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.windows95.com">outer 3</a></li>
<li><a href=http://www.codingforums.com/archive/index.php/"http://www.shareware.com">outer 4</a></li>
</ul>
</ul>
</div>

</body>

</html>

---------------------------------------------------------------------
Finally, here is the associated CSS:

.navmenu
{
text-align:left;
font-size; 85%;
background:#e6e6fa;
border-left: solid thin white;
position:absolute;
visibility:show;
}

ul{
font-size: 90%;
list-style-type: none;
margin-left: 5%;
}