jQuery Form Label Classes For Checkboxes and Radio Buttons

jquery.label-classes.js

/**
 * jQuery Form Label Classes For Checkboxes and Radio Buttons
 *
 * Plugin adds classes to labels of checkboxes and radio buttons depending on
 * whether the element is checked or is in focus. Aids in the application of using
 * images to replace the actual form elements.
 *
 * Plugin Author: Robert B Gottier 
 * Author Website: brianswebdesign.com
 * Author Screenname: skunkbad
 * Copyright 2012 - All Rights Reserved
 * Licensed under BSD - http://http://www.opensource.org/licenses/BSD-3-Clause
 */

;(function($){
	$.fn.labelClasses = function() {

		function set_checked(e){
			$('[type="radio"], [type="checkbox"]').each(function(){

				var el = $(this);

				/* Remove all classes */
				el.closest('label').removeClass('c_on c_on_focus c_off_focus r_on r_on_focus r_off_focus');

				/* Apply class to label if element is checked */
				if( el.is(':checked') ){
					if(el.is("[type=radio]")){
						el.closest('label').addClass('r_on');
					}else{
						el.closest('label').addClass('c_on');
					}
					var on = true;
				}else{
					var on = false;
				}

				/* If element has focus */
				if( el.is(':focus') ){
					/* If not a click event */
					if( e.type != 'click' ){
						/**
						 * If not IE and a focus event
						 * and not Opera and a focus event
						 */
						if( 
							! ( $.browser.msie && e.type == 'focus') &&
							! ( $.browser.opera && e.type == 'focus')
						){
							set_focus( on, el );
						}

					/* If a click event fired by spacebar */
					}else if( e.type == 'click' && e.clientX == 0 && e.clientY == 0 ){
						set_focus( on, el );

					/* IE can't tell the difference between a spacebar click or mouse click */
					}else if( e.type == 'click' && $.browser.msie ){
						set_focus( on, el );
					}
				}

			});
		}

		function set_focus( on, el ){
			/* If the element is checked */
			if(on){
				if(el.is("[type=radio]")){
					el.closest('label').addClass('r_on_focus');
				}else{
					el.closest('label').addClass('c_on_focus');
				}

			/* If the element is not checked */
			}else{
				if(el.is("[type=radio]")){
					el.closest('label').addClass('r_off_focus');
				}else{
					el.closest('label').addClass('c_off_focus');
				}
			}
		}

		/**
		 * Focus event required because the element can obtain focus via tab.
		 * Blur event required because the last element can lose focus via tab.
		 * Keyup event required for Chrome and Safari in order to obtain focus.
		 * Keyup event not required by Firefox or IE.
		 * Keyup seems required by Opera to keep focus indicated when using spacebar to check.
		 */
		$('[type="radio"], [type="checkbox"]').on('focus blur keyup', function(e){
			set_checked(e);
		});

		/* Click event is obviously required. */
		$('.checkbox, .radio').on('click', function(e){
			set_checked(e);
		});

		set_checked();
	}
})(jQuery);