/***************************
	(C) 2006 by Charleshan www.Denninger.nl
	http://www.paranoid.demon.nl
	Free for all users, but leave in this header.
	Started:	10-10-2006
	Last change:	11-02-2009
	==========================
	Function:		What is does:
	Change_ClassByDate()	Change the style dynamicaly according to date by a given Class Search string, "*" contains ALL the Classes in the document.
	==========================
	v1.0T	10-10-2006	Started as a .js scriptfile based on a function found @: http://www.javascriptfr.com/code.aspx?ID=27999
	v1.0	11-10-2006	Added the CSS specification.
	v1.1	13-10-2006	No need for using double values ie: class="2006/10/10" AND id="2006/10/10", only class will be checked
	v1.2	11-02-2009	Reset current time also to 00:00:00
	Notes:
		At this moment you'll have to give both class as id the same datevalue, only the first occurence of these values will actually be changed... I don't know wether I'am going to change this soon...

* Use CSS in a seperate file or HTML code like this:
<style type="text/css">
.Date_Past{
	background-color: #FFFFFF;
	color: #808080;
}
.Date_Present{
	background-color: #FFFFAA;
	color: #008080;
}
.Date_Future{
	background-color: #FFFFCC;
	color: #400080;
}
</style>

* Declare a date like this:
<div class="2006/10/10">test date</div>
**************************/

function Change_ClassByDate(str_SearchClass){
	var str_CheckDate,obj_CheckDate;//,obj_CurrentClass;
	var obj_CurrentDate=new Date();
	var int_Year;
	if (obj_CurrentDate.getYear()<1900) {	//Bug in firefox?
		int_Year=obj_CurrentDate.getYear()+1900;
	} else {
		int_Year=obj_CurrentDate.getYear();
	}
	obj_CurrentDate=new Date(int_Year+"/"+(obj_CurrentDate.getMonth()+1)+"/"+obj_CurrentDate.getDate());	//Reset current time to 00:00:00
	//var int_CurrentLink=0;
	//str_CheckDate=obj_CurrentDate.getYear()+"/"+(obj_CurrentDate.getMonth()+1)+"/"+obj_CurrentDate.getDate();	//Reset the current date's time to 0:00:00
	//obj_CurrentDate=new Date(str_CheckDate);	//=Error in Mozilla???
	var arr_ClassAll=document.getElementsByTagName(str_SearchClass);	//Temporary array, "*" contains ALL the Classes in the document...
	for(var int_Count01=0;int_Count01<arr_ClassAll.length;int_Count01++){	//Check ALL elements
		str_CheckDate=arr_ClassAll[int_Count01].className;
		//str_CheckDate=str_CheckDate.substring(str_CheckDate.indexOf("/")+1,str_CheckDate.length)+"/"+str_CheckDate.substring(0,str_CheckDate.indexOf("/"));	//Change 2006/10/30 to 10/30/2006.
		if(str_CheckDate.indexOf("\\")>-1)str_CheckDate=str_CheckDate.replace(/\\/ig,"/");	//Search and replace all "\" with "/", using: /i (Ignore Case) and /g (Global Search);
		if(str_CheckDate.indexOf("-")>-1)str_CheckDate=str_CheckDate.replace(/-/ig,"/");	//Search and replace all "-" with "/", using: /i (Ignore Case) and /g (Global Search);
		if(str_CheckDate.indexOf("/")>-1){
			//if(confirm("'"+arr_ClassAll[int_Count01].className+"' = '"+str_CheckDate+"' found.")==false){break};	//return;
			obj_CheckDate=new Date(str_CheckDate);	//Date syntax: Using hyphens to separate the Year-Month-Day is not standard. new Date('1971/02/11 11:11:11') works fine however in Mozilla based browsers. Reference: http://ejohn.org/projects/rss2json
			//if (obj_CheckDate.getYear()<1900) {	//Bug in firefox?
			//	int_Year=obj_CheckDate.getYear()+1900;
			//} else {
			//	int_Year=obj_CheckDate.getYear();
			//}
			//obj_CheckDate=new Date(int_Year+"/"+(obj_CheckDate.getMonth()+1)+"/"+obj_CheckDate.getDate());	//Reset check time to 00:00:00
			//if(confirm("'"+obj_CheckDate.toLocaleString()+"' vs '"+obj_CurrentDate.toLocaleString()+"'.")==false){break};	//return;
				//alert("id '"+document.getElementById(arr_ClassAll[int_Count01].className).id+"' found.");	//"' = '"+document.getElementByTagName(arr_ClassAll[int_Count01].className).id+
			/*if(arr_ClassAll[int_Count01].id!==arr_ClassAll[int_Count01].className){
				//alert("id '"+arr_ClassAll[int_Count01].id+"' changed to className '"+arr_ClassAll[int_Count01].className+"' part 1.");
				arr_ClassAll[int_Count01].id=arr_ClassAll[int_Count01].className;
				//if(confirm("id '"+arr_ClassAll[int_Count01].id+"' changed to className '"+arr_ClassAll[int_Count01].className+"' part 2.")==false){break};	//return;
			}*/
			//if(arr_ClassAll[int_Count01].id)alert("id '"+arr_ClassAll[int_Count01].id+"' found.");
			//obj_CurrentClass=document.getElementById(arr_ClassAll[int_Count01].className);
			//if ((obj_CheckDate.getYear()+"/"+(obj_CheckDate.getMonth()+1)+"/"+obj_CheckDate.getDate())==(obj_CurrentDate.getYear()+"/"+(obj_CurrentDate.getMonth()+1)+"/"+obj_CurrentDate.getDate())){	//Check the current date ONLY (obj_CheckDate.getTime()==obj_CurrentDate.getTime()) has a timepart to!
			if (obj_CheckDate.getTime()==obj_CurrentDate.getTime()){
				//if(confirm("'"+obj_CheckDate.toLocaleString()+"' = '"+obj_CurrentDate.toLocaleString()+"'.")==false){break};	//return;
				arr_ClassAll[int_Count01].className="Date_Present";	//obj_CurrentClass.className="Date_Present";
				//int_CurrentLink+=1
			} else if (obj_CheckDate.getTime()<obj_CurrentDate.getTime()){
				//if(confirm("'"+obj_CheckDate.toLocaleString()+"' < '"+obj_CurrentDate.toLocaleString()+"'.")==false){break};	//return;
				arr_ClassAll[int_Count01].className="Date_Past";	//obj_CurrentClass.className="Date_Past";
			} else { //if (obj_CheckDate.getTime()>obj_CurrentDate.getTime()){
				//if(confirm("'"+obj_CheckDate.toLocaleString()+"' > '"+obj_CurrentDate.toLocaleString()+"'.")==false){break};	//return;
				arr_ClassAll[int_Count01].className="Date_Future";	//obj_CurrentClass.className="Date_Future";
				//int_CurrentLink+=1
			}
			/*if(int_CurrentLink==1){
				alert("int_CurrentLink '"+int_CurrentLink+"'");
				int_CurrentLink+=1
				arr_ClassAll[int_Count01].name="js_MostCurrentDate"
			}*/
		}
	}
}

Change_ClassByDate("*");	//This is the command, but you can place this line anywhere else in a document between <script> tags...