[thelist] onclick event

Fred D Yocum fdy at mcc.org
Wed Dec 20 16:04:02 CST 2006

Apologies for the length of this post. I have been going around in circles 
for about a day now. 

I have a nested set of ordered lists which has six levels -- it is a sort 
of index of about six hundred document/document fragments. 
I want my DOM script to  check each ordered list to see whether it is 
contained in a list item (li). If it is nested in a list item, then set 
the display for the ordered list to hidden and add an element, to the 
parent list item. This element when clicked will reset the display of the 
nested list to "block", making it visible. This way people can click their 
way deeper into the index, making each level visible when they need it.

Every thing works except the onclick which appears to do nothing... I 
tried a direct statement
 downObject.onclick = thisOL.style.display="block";//hide the existing 

I've tried it in a function literal
downObject.onclick = function () { //add an onclick event
                                thisOL.style.display="block";//hide the 
existing list
Nothing works :-(

Here is the full script

function PrepWindow(){
var theContent = document.getElementById('MainContent'); //Find the main 
var listOL = theContent.getElementsByTagName('ol');  //Find all of the 
nested ordered list

        for (var a=0; a < listOL.length; a++){  //Loop through the list 
                var thisOL = listOL[a];
                 if(thisOL.parentNode.nodeName =="LI") {  //Check for 
containing lists
                        olContainer = thisOL.parentNode; //identify the 
containing li item
                        thisOL.style.display="none"; //hide the existing 
                        var downObject = 
document.createElement('span');//Create a span which is the close area
//give it a class
                        var downImg = document.createElement('img'); 
//Create the down img
                        downImg.setAttribute('alt','Down a level');
                        downObject.appendChild(downImg); //Put it down img 
into the span
                        downObject.onclick = function () { //add an 
onclick event
                                thisOL.style.display="block";//hide the 
existing list
                        olContainer.appendChild(downObject); //Put the 
span into the document next to the ordered list 

window.onload = PrepWindow; //Call the javascript for this page

Frederick D Yocum

More information about the thelist mailing list