function loopElements(el,level){
	for(var i=0;i<el.childNodes.length;i++){
		//We only want LI nodes:
		if(el.childNodes[i] && el.childNodes[i]["tagName"] && el.childNodes[i].tagName.toLowerCase() == "li"){
			//Ok we have the LI node - let's give it a className
			el.childNodes[i].className = "menu"+level
			//Let's look for the A and if it has child elements (another UL tag)
			childs = el.childNodes[i].childNodes
			for(var j=0;j<childs.length;j++){
				temp = childs[j]
				if(temp && temp["tagName"]){
					if(temp.tagName.toLowerCase() == "a"){
						//We found the A tag - let's style it
						temp.className = "menu"+level
						//Onclick event
						temp.onclick = showHide;
						//var to hold the a tag
						el.childNodes[i].a = temp
					}else if(temp.tagName.toLowerCase() == "ul"){
						//Hide sublevels
						temp.style.display = "none"
						//Set class
						temp.className= "menu"+level
						//Recursive - calling it self with the new found element
						//to go all the way through the three.
						loopElements(temp,level +1) 
					}
				}
			}	
		}
	}
}


function showHide(){
	//Bluring the tag so we don't get the "selected square"
	this.blur()
	
	//We have a A tag - need to go to the LI tag to check for UL tags:
	el = this.parentNode
	//Loop for UL tags:
	for(var i=0;i<el.childNodes.length;i++){
		temp = el.childNodes[i]
		if(temp && temp["tagName"] && temp.tagName.toLowerCase() == "ul"){
			//Check status:
			if(temp.style.display=="none"){
				temp.style.display = ""
			}else{
				temp.style.display = "none"	
			}
			}
		}
	
	
	//Returning true if there's a link there. Else returns false so it doesn't go to "#"
	if(this.href!="#"){
		return true
	}else return false
}


function setClasses(menu){
	var menu = document.getElementById(menu)
	if(!menu.childNodes) return //Opera supports getElementById - but not childNodes
	menu.className="menu"+0
	//hide the menu before styling it:
	loopElements(menu,0)
	
}
//Browsercheck --
if(document.getElementById && document.createElement) setClasses("menu")