var oldClassNameA;
var oldClassNameB;

document.getElementById('rankTable').onclick = function(e) { 
	e = e || event; 
	var el = e.target || e.srcElement; 
	if (el.tagName.toLowerCase() == 'td') 
	{
		if(e.ctrlKey)
		{
			removeClass(this, el.className);
			changeClassB(this, el.className + 'B'); // make last class of type B to color orange
			oldClassNameB = el.className + 'B';
		}
		else
		{
			removeClass(this, el.className + 'B');
			changeClassA(this, el.className);
			oldClassNameA = el.className;
		}
	}
};

 function changeClassA(el, s) 
 { 
	removeClass(el,oldClassNameA);
	addClass(el, s); 
 }
 
 function changeClassB(el, s)
 {
	removeClass(el, oldClassNameB);
	addClass(el, s); 
 }
 
function hasClass(el, className) {
  var cl = el.className, p = el.className.indexOf(className);
  return p != -1; 
  //p == 0 && cl.length == className.length || p > 0 &&
    // !/\S/.test(el.className.charAt(p - 1) + el.className.charAt(p + cl.length));
}

function addClass(el, className) {
  if(!hasClass(el, className))
    el.className += el.className ? ' ' + className : className;
}

function removeClass(el, className) {
  if(hasClass(el, className)) {
    var cn = [], ns = el.className.split(/\s+/), l = ns.length;
    for(var i = 0; i < l; i++)
      if(ns[i] != className)
        cn.push(ns[i]);
        
    el.className = cn.join(' ');
  }
}