Assign class to parent when child is clicked or hovered over

I’m using a tab navigation script that assigns a class to the selected tab and a tab that’s hovered over. For my particular layout I require the tab function to work on a span within each list item.

Please take a look here [B]http://jsfiddle.net/spirelli/3a69W/6/[/B]

I need to change the background of the parent li of a hovered-over or selected span, and need help achieving this. I thought that maybe the parent could also be assigned ‘selected’ or ‘hover’ as a class (CSS for this scenario included). But there might be a cleverer option?

Ideally, this should be done outside the moo_tabcontrol.js script, and also without jQuery. I would be very grateful for any help here as I’m rather illiterate when if comes to Javascript. Many thanks.

Hi,
Not positive of what you’re asking for, nor am I certain it would work (since I can’t replicate the same code) but is this along the lines?


<li><span onclick="doParent(this)">Retina</span></li>

function doParent(obj) {
    obj.parentNode.style.backgroundColor = "red";
}