$$('#menuButtonNode').each(function(node){
		node.observe('mouseenter', highlightNode);
		node.childElements().each(function(child){
			var id = child.innerHTML;
			if($(id) != null) {
				$(id).observe('mouseleave', function(event){
					passive(event, node);
				}.bind(node));
				$(id).observe('mouseenter', function(event){
					highlight(event, node);
				}.bind(node));
			}
		}.bind(node));
		node.observe('mouseleave', passiveNode);
	});

function highlightNode(event){
	$$('#menuButtonNode').each(function(node){
			if(node.hasClassName('menuButtonNodeHover'))
				node.removeClassName('menuButtonNodeHover');
		}.bind(this));
	
	if(!this.hasClassName('menuButtonNodeHover')){
		this.addClassName('menuButtonNodeHover');
	}
}

function passiveNode(event){
	if(this.firstDescendant() == null){
		this.removeClassName('menuButtonNodeHover');
	}else {
		if($(this.firstDescendant().innerHTML) != null){	
			this.removeClassName('menuButtonNodeHover');
		}else {
			this.removeClassName('menuButtonNodeHover');
		}
	}
}

function highlight(event, button){
	$$('#menuButtonNode').each(function(node){
			if(node.hasClassName('menuButtonNodeHover'))
				node.removeClassName('menuButtonNodeHover');
		}.bind(this));
	
	if(!button.hasClassName('menuButtonNodeHover')){
		button.addClassName('menuButtonNodeHover');
	}
}

function passive(event, button){
	if(button.hasClassName('menuButtonNodeHover'))
		button.removeClassName('menuButtonNodeHover');
}