Doogledude123 45 Posting Whiz

Alright, so I found a tutorial on how to use lists to make a "TreeList" type thing, basically a list, ordered or unordered, that has a nested list that is collapsible.
However, it doesn't seem to be working for me.

Here's some code that I'm sure you will figure out.

JavaScript:

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

    function addEvents()
    {
        activateTree(document.getElementById("navigation"));
    }

    function activateTree(oList)
    {
        for(var i = 0; i < oList.getElementsByTagName("ul").length; i++)
        {
            oList.getElementsByTagName("ul")[i].style.display="none";
        }

        oList.addEventListener("click", toggleBranch, false);
    }

    function toggleBranch(event)
    {
        var oBranch, cSubBranches;
        oBranch = event.target,
        cSubBranches = oBranch.getElementsByTagName("ul");

        if(cSubBranches.length > 0)
        {
            if(cSubBranches[0].style.display == "block")
            {
                cSubBranches[0].style.display = "none";
            }
            else
            {
                cSubBranches[0].style.display = "block";
            }
        }
    }

HTML:

    <nav>
        <ul id="navigation">
            <li><a href="#home">Home</a></li>
            <li><a href="#projects">Projects</a></li>
                <ul class="projectsList">
                    <li><a href="#echo">Echo</a></li>
                </ul>
            <li><a href="#contact">Contact</a></li>
            <li><a href="#about">About</a></li>
        </ul>
    </nav>

Try opening dev tools in the browser, there's a null somewhere.
Really wish the Editor Toolbar would show on Mobile Devices.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.