// This function achieve following:
// 1. Show Child UL when user click on li
// 2. Remove onclick event from selected li
// 3. Creates onclick event for other li tags
function ToggleLinks(node)
{
    var childULID = "childUL" + node.id.substring(6);
    var hrefID = "href" + node.id.substring(6);
    var liID = node.id;
    
    // Step 1: First hide all child ULs except the selected one
    var allULs = document.getElementsByTagName('ul');
    for (ulCounter=0;ulCounter<allULs.length;ulCounter++)
    {
        if ((allULs[ulCounter].id).substr(0, 7) == "childUL" && allULs[ulCounter].id != childULID)
        {
            document.getElementById(allULs[ulCounter].id).className = 'HideHTMLControl';
        }
    }
    
    // Step 2: Toggle li
    if (document.getElementById(childULID) != null)
    {
        if (document.getElementById(childULID).className == 'HideHTMLControl')
        {
            document.getElementById(childULID).className = 'ShowHTMLControl';
            document.getElementById(liID).className = 'selected';
        }
        else
        {
            document.getElementById(childULID).className = 'HideHTMLControl';
            document.getElementById(liID).className = '';
        }
    }

    // Step 3: remove selected class from all li's except the currently selected one
    var allLIs = document.getElementsByTagName('li');
    for (liCounter=0;liCounter<allLIs.length;liCounter++)
    {
        // Main LI
        if ((allLIs[liCounter].id).substr(0, 6) == "liMain" && allLIs[liCounter].id != node.id)
        {
            document.getElementById(allLIs[liCounter].id).className = '';
        }
        
        // Child LI
        if ((allLIs[liCounter].id).substr(0, 7) == "liChild")
        {
            document.getElementById(allLIs[liCounter].id).className = '';
        }
    } 
}

// This will be used to hide left nav control on home page
function HideControl(id)
{
    alert(document.getElementById(id));
    document.getElementById(id).className = '';
}