function init_dl() {

    if (!document.getElementById || !document.getElementsByTagName) return false;

    var dts = document.getElementById('titles').getElementsByTagName('li');
    var dds = document.getElementById('contents').getElementsByTagName('li');

    var item;

    for (var i = 0; i < dts.length; i++) {
    
        dts[i].onclick = function() { show_item(this.className); };
        dts[i].onmouseover = function() { show_item(this.className); };

    }

    return true;

}

function hide_items(items) {

    for (var i = 0; i < items.length; i++) {

        items[i].style.display = 'none';

    }

}

function clear_current(items) {

    for (var i = 0; i < items.length; i++) {

        if (items[i].className.indexOf('current') > -1) {

            items[i].className = items[i].className.replace(new RegExp("current\\b"), "");
            items[i].className = items[i].className.replace(new RegExp(" current\\b"), "");

        }

    }

}

function show_item(item) {

    if (!document.getElementById || !document.getElementsByTagName) return false;

    if (!item) {

        item = "approach_0";

    } else {

        item = trim(item);

    }

    var dt_container = document.getElementById('titles');
    var dd_container = document.getElementById('contents');

    var dts = dt_container.getElementsByTagName('li');
    var dds = dd_container.getElementsByTagName('li');

    var dt = getElementsByClass(item,dt_container)[0];
    var dd = getElementsByClass(item,dd_container)[0];

    if (dt.className.indexOf('current') < 0) {

        hide_items(dds);
        clear_current(dts);

        dt.className += ' current';

        var html = dd.innerHTML;
        var container = document.getElementById('approach_container');
        container.innerHTML = html;

    }

    return true;

}

addLoadEvent(function() {
    init_dl();
    show_item();
});