//JavaScript Document


function prepareListItems() {

    // Make sure that the browser understands the DOM methods I will be using
    
    if( document.getElementById && document.getElementsByTagName ) {
  
        //Get all listItems based on the class 'tabItem' and the tagname 'li'
         
        var listItems = getElementsByClassName( 'mainNav', 'td' );
      
        //For each listItems in the array, assign an onmouseover/onmouseout eventhandler
        
        for( var i=0; i < listItems.length; i++ ){
      
            listItems[i].onmouseover = function(){
        
                this.className = 'mainNavBlue';
          
            };
           
            listItems[i].onmouseout = function() {
       
                this.className = 'mainNav';
          
            };  
        
        }
    
    }
  
}


function getElementsByClassName(clsName, htmlTag) {

	var arr = new Array();
	
	var elems = document.getElementsByTagName(htmlTag);
	
	for ( var cls, i = 0; (elem = elems[i] ); i++) {
	
		if (elem.className == clsName ){
		
			arr[arr.length] = elem;
			
		}
		
	}
	
	return arr;
}


function addLoadEvent(func) {

    var oldonload = window.onload;
  
    if (typeof window.onload != 'function') {
  
        window.onload = func;
    
    } else {
  
        window.onload = function() {
    
        if (oldonload) {
      
            oldonload();
        
        }
      
        func();
      
        }
    
    }
  
}


addLoadEvent(prepareListItems);