jQuery.fn.customcheckbox = function(){
	$(this).each(function(i){	
		if($(this).is('[type=checkbox],[type=radio]')){
			var input = $(this);
			
			
			// get the associated label using the input's id
			var label = $('label[for='+input.attr('id')+']'),
				allInputs;
			
			//get type, for classname suffix 
			var inputType = (input.is('[type=checkbox]')) ? 'checkbox' : 'radio';
			
			// wrap the input + label in a div 
			$('').insertBefore(input).append(input, label);
			
			// find all inputs in this set using the shared name attribute.
			// Needed only for RADIO-Buttons. Checkboxes can use name=catname[] for array submit, this would break the selector
			
			allInputs = $('input[name="'+input.attr('name')+'"]');
			
			

			// necessary for browsers that don't support the :hover pseudo class on labels
			/*label.hover(
				function(){ 
					$(this).addClass('hover'); 
					if(inputType == 'checkbox' && input.is(':checked')){ 
						$(this).addClass('checkedHover'); 
					} 
				},
				function(){ $(this).removeClass('hover checkedHover'); }
			);*/
						
			//bind custom event, trigger it, bind click,focus,blur events					
			input.bind('updateState', function(){
				if ($(this).is(':checked')) {
					if ($(this).is(':radio')) {
						allInputs.each(function(){
							input.parents('form').find('label[for='+$(this).attr('id')+']').removeClass('checked');
						});	
					};
					$(this).siblings('label').addClass('checked');
				}
				else { label.removeClass('checked checkedHover checkedFocus'); }					
			})
			.trigger('updateState')
			.parent().click(function(){ 
				$(this).find('input').trigger('updateState');
			});
		}
	});
};