function getElementsByClassName(parentElement, className) {
    var childElements = parentElement.all ? parentElement.all : parentElement.getElementsByTagName('*');
    var selectedElements = new Array();

    for (var i = 0; i < childElements.length; i++) {
        if (childElements[i].className == className) {
            selectedElements.push(childElements[i]);
        }   
    }
    
    return selectedElements;
}

function initExpandableLists(expandableLists) {
    if (document.getElementById && document.createTextNode) {
        for (var i = 0; i < expandableLists.length; i++) {
            var list = expandableLists[i];
            var items = getElementsByClassName(list, "ExpandableItem");

            for (var j = 0; j < items.length; j++)
            {
                items[j].onclick = function(){ toggleExpandableRegion(list, this); return false}
                items[j].onkeypress = function(){ toggleExpandableRegion(list, this); return false}
            }
        
            collapseExpandableRegions(list);
        }
    }
}

function toggleExpandableRegion(list, item) {
    // Using parentNode rather than parentElement; IE understands both, FF only understands parentNode.
    var region = getElementsByClassName(item.parentNode, "ExpandableRegion")[0];
        
    if (region.style.display == 'block') {
        region.style.display = 'none'
    }
    else {
        collapseExpandableRegions(list);
        
        region.style.display = 'block'
    }
}

function collapseExpandableRegions(list) {
    var regions = getElementsByClassName(list, "ExpandableRegion");
    
    for (var i = 0; i < regions.length; i++)
    {
        regions[i].style.display = 'none';
    }
}   

function init() {
    initExpandableLists(getElementsByClassName(document,'ExpandableList'));
}