var OnClickBox = {
    allSpanBoxes : new Array(),
    divContainer : null,
    push : function (content)
    {
        number = OnClickBox.allSpanBoxes.length;
        OnClickBox.allSpanBoxes[number] = content;
        return number;
    },

    setDivContainer : function (e)
    {
        OnClickBox.divContainer = e;
    },

    setInfoBox : function (i)
    {
        OnClickBox.divContainer.innerHTML = OnClickBox.allSpanBoxes[i];
	return false;
    }
}


var startOnClickBox = function()
{
    var list    = document.getElementById("clickbox_list");
    var details = document.getElementById("clickbox_details");

    if (!list || !details) return false;

    var i_list    = list.firstChild;
    var i_details = details.firstChild;


    while(i_list && i_details)
    {
        while (i_list && i_list.nodeName.toLowerCase() != "li") i_list = i_list.nextSibling;
        while (i_details && i_details.nodeName.toLowerCase() != "span") i_details = i_details.nextSibling;

        // Wenn beide Laufvariablen den Gleichen Tag verwischen, dann machen wir weiter
        if (i_list && i_details && i_list.nodeName.toLowerCase() == "li" && i_details.nodeName.toLowerCase() == "span")
        {
            var i = OnClickBox.push(i_details.innerHTML);
            i_list.innerHTML = '<a href="#" onclick="return OnClickBox.setInfoBox('+i+');">' + i_list.innerHTML + '</a>';
        }

        if (i_list) i_list = i_list.nextSibling;
        if (i_details) i_details = i_details.nextSibling;
    }

    // innerHTML von den Details loeschen
    details.innerHTML = "";

    // Container setzen
    OnClickBox.setDivContainer(details);

}

addOnLoadEvent(startOnClickBox);