function renderGradient(elem, colorStart, colorEnd) {
	var items = $(elem).find(" ul > li");

	/**
	 *  Colors must be in hexa format (6 hexadecimal numbers, no hash sign at the start): RRGGBB (R=red, G=green, B=blue)
	 */
	var colorsStart = colorStart.match(/^([a-f0-9][a-f0-9])([a-f0-9][a-f0-9])([a-f0-9][a-f0-9])$/i);
	var colorsEnd   = colorEnd.match(/^([a-f0-9][a-f0-9])([a-f0-9][a-f0-9])([a-f0-9][a-f0-9])$/i);
	var numberOfIntervals = items.length - 1;
	var start = [
				parseInt(colorsStart[1], 16),
				parseInt(colorsStart[2], 16),
				parseInt(colorsStart[3], 16)
				],
		step  = [
				(parseInt(colorsEnd[1], 16) - start[0]) / numberOfIntervals,
				(parseInt(colorsEnd[2], 16) - start[1]) / numberOfIntervals,
				(parseInt(colorsEnd[3], 16) - start[2]) / numberOfIntervals
				];

	items.each(
		function(index) {
			var $this = $(this);
			var color = "#" + (start[0] + index * Math.round(step[0])).toString(16)
							+ (start[1] + index * Math.round(step[1])).toString(16)
							+ (start[2] + index * Math.round(step[2])).toString(16);
			
			if ( ! $this.is('.selected') ) {
				$this.css("background-color", color);
			}				
		}
	);
};
$(function() {
	renderGradient('#headline', '525252', 'A8A8A8');
	renderGradient('#submenu', '97B48F', '437634');
});