how to create tooltips with javascript for tabs

Hi I would like to use javascript to control what tooltip displays when a tab is rolled over depending on which tab was clicked.

 <li id='1tab_1a' class='selected'>a id='1link_1a'  title="Customer Info Screen"><span >Customer Info</span></a></li>
  <li id='1tab_1b' >a id='1link_1b'  title="Order Detail"  ><span>Order</span></a></li>

 <li id='1tab_1c' >a id='1link_1c'  title="Phone Detail" ><span>Phone:  7093521232</span></a></li>

For example when the Customer Info tab is selected I would like the tooltips to be like above but when Order is the tab selected I would like the tooltip to say Customer Info Detail, Order Detail Screen, and Phone Detail. How could I use an onclick event to control what tooltip is being displayed depending on which tab is selected? I have about 20 sets of customer info and sometimes not everyone contains all of the tabs and I w开发者_如何学运维ould also like to be able to add more customers.

I've partially tested this code, and I think it may work for you. This assumes that the <li> are inside a <ul>, and you have added onclick="onClick(this)" to the <a> tags.

function onClick(obj) {
    var a, li, selected, ul = obj.parentNode.parentNode;

    for (var i=0; i<ul.childNodes.length; i++) {
    li = ul.childNodes[i];

        if (li.nodeName.toUpperCase()=="LI") {
            selected = (li.className=="selected");
            a = li.firstChild;

            switch (li.id) {
                case "1tab_1a": a.title = (selected)?"Customer Info Screen":"Customer Info Detail"; break;
                case "1tab_1b": a.title = (selected)?"Order Screen":"Order Detail"; break;
                case "1tab_1c": a.title = (selected)?"Phone Screen":"Phone Detail"; break;
            }
        }
    }
}

EDIT: It looks like your sample HTML code is missing some open tag symbols before the <a> tags.

EDIT: This method is based on the class attribute of the <li> tags. I'm not sure how you are currently changing that value to "selected". You could wrap it into this onclick function by adding the following to the first line under the if:

li.className = (li==obj.parentNode)?"selected":"";