Hey, i've got this DOM Scripted Image Gallery built and it works fine in Firefox and Safari but has major accesibility problems in Mac IE 5.2.3 which i'd like to straighten out and some minor problems in IE 6 I can't pinpoint. If someone can take a look and see if anything stands out that would be great. Thx.

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Dom Gallery</title>
<script type="text/javascript">

var initImageGallery = function () {
	var gallery = document.getElementById("imageGallery");
	//
	var thumbs = document.getElementById("thumbs");
	var imageList = document.getElementById("imageList");
	//
	var view = document.getElementById("view");
	var viewDesc = document.getElementById("viewDesc");
	var viewImage = document.getElementById("viewImage");
	var fullImage = document.createElement("img");
	fullImage.setAttribute("id", "fullImage");
	
	// nodes to be deleted array
	var delNodes = new Array();
	
	for (var i=0; i<imageList.childNodes.length; i++) {
		var listNode = imageList.childNodes[i];
		
		if (listNode.nodeName.toLowerCase() == "dt") {			
			// link
			var thumb = listNode.firstChild;
			thumb.src = thumb.getAttribute("href").replace(".", "_thumb.");
			thumb.setAttribute("title", thumb.firstChild.nodeValue);
			// create desc dl			
			thumb.desc = document.createElement("dl");
			// 
			thumb.dt = document.createElement("dt");
			thumb.dt.appendChild(document.createTextNode(thumb.title));
			thumb.desc.appendChild(thumb.dt);
			
			// add thumbnail image
			thumb.image = document.createElement("img");
			thumb.image.className = "thumbnail";
			thumb.image.setAttribute("src", thumb.src);
			thumb.image.setAttribute("title", thumb.title);
			thumb.image.setAttribute("alt", thumb.title);
			// replace link text with the image
			thumb.replaceChild(thumb.image, thumb.firstChild)
			
			thumb.onclick = function () {
				// there is no image in viewImage div
				if (!document.getElementById("fullImage")) {
					// then add fullImage there
					viewImage.appendChild(fullImage);
				}
				// change fullImages src and title
				fullImage.setAttribute("src", this.getAttribute("href"));
				fullImage.setAttribute("title", this.getAttribute("title"));
				// if description dl exists
				if (viewDesc.getElementsByTagName("dl").length != 0) {
					// remove it
					viewDesc.removeChild(viewDesc.getElementsByTagName("dl")[0]);
				}
				viewDesc.appendChild(this.desc);
							
				return false;
			};
		} else if (listNode.nodeName.toLowerCase() == "dd") {
			// add dd's
			var tempNode = listNode.cloneNode(true);
			thumb.desc.appendChild(tempNode);
			// add listNode to the delNodes array
			// and remove it later 
			delNodes.push(listNode);
		};
	};
	// remove nodes (dds from imageList dl)
	for (var k in delNodes) {
		imageList.removeChild(delNodes[k]);
	}
	// put the last image and descriptions in place
	thumb.onclick();
};

window.onload = function () {
	initImageGallery();
}

</script>
<style type="text/css">
* {margin: 0; padding: 0; border: none;}
body { font-family:Arial, Helvetica, sans-serif; font-size:1em; background:#000; color:#9f9f9f;}
#imageGallery {}
#thumbs { width: 40%; float:left;}
#thumbs dl { margin: 20px;}
#thumbs dt {}
#thumbs dd {}
#thumbs .thumbnail { margin: 4px; padding:4px; background:#313133; float: left;}
#view { width: 60%; float:left;}
#viewDesc { }
#viewDesc dl { margin: 20px;}
#viewDesc dt { font-size:1.1em; font-weight:bold;}
#viewDesc dd {}
#viewImage { }
#viewImage #fullImage { padding:15px; background:#313133;}
h1 {margin: 20px; text-transform:uppercase; font-size:1.2em; color:#5cdd83;}

</style>
</head>

<body>

<div id="imageGallery">
	<div id="thumbs">
		<h1>Thumbnails</h1>
		<dl id="imageList">
			<dt><a href="image001.jpg">Image 001</a></dt>
			<dd>Description of Image 001 1</dd>
			<dd>Description of Image 001 2</dd>
			<dd>Description of Image 001 3</dd>
			<dd>Description of Image 001 4</dd>
			<dt><a href="image002.jpg">Image 002</a></dt>
			<dd>Description of Image 002 1</dd>
			<dd>Description of Image 002 2</dd>
			<dt><a href="image003.jpg">Image 003</a></dt>
			<dd>Description of Image 003 1</dd>
			<dd>Description of Image 003 2</dd>
			<dd>Description of Image 003 3</dd>
			<dt><a href="image004.jpg">Image 004</a></dt>
			<dd>Description of Image 004 1</dd>
		</dl>
	</div>
	<div id="view">
		<div id="viewDesc">
		<h1>Title and description</h1>
		</div>
		<div id="viewImage">
			<h1>Artwork</h1>
		</div>
	</div>
</div>

</body>
</html>