https://eatcrafted.com/assets/js/zInput.js

1$.fn.zInput = function(){
2
3var $inputs = this.find(":radio,:checkbox");
4$inputs.hide();
5var inputNames = [];
6$inputs.map(function(){
7  inputNames.push($(this).attr('name'));
8});
9
10inputNames = $.unique(inputNames);
11
12$.each(inputNames, function(index,value){
13
14	var $element = $("input[name='" + value + "']");
15	var elementType = $element.attr("type");
16	$element.wrapAll('<div class="zInputWrapper" />');
17	if (elementType == "radio"){
18		$element.wrap(function(){ return '<div class="zInput"><span style="display:table;width: 100%;height: 100%;"><span style="display: table-cell;vertical-align:middle;">' + $(this).attr("title") + '</span></span></div>'});
19	}
20	if (elementType == "checkbox")
21	{
22		$element.wrap(function(){ return '<div class="zInput zCheckbox"><span style="display:table;width: 100%;height: 100%;"><span style="display: table-cell;vertical-align:middle;">' + $(this).attr("title") + '</span></span></div>'});	
23	}
24	
25	});
26
27
28var $zRadio = $(".zInput").not(".zCheckbox");
29var $zCheckbox	= $(".zCheckbox");
30
31$zRadio.click(function(){
32	$theClickedButton = $(this);
33
34	//move up the DOM to the .zRadioWrapper and then select children. Remove .zSelected from all .zRadio
35	$theClickedButton.parent().children().removeClass("zSelected");
36	$theClickedButton.addClass("zSelected");
37	$theClickedButton.find(":radio").prop("checked", true).change();	
38	});
39
40$zCheckbox.click(function(){
41	$theClickedButton = $(this);
42
43	//move up the DOM to the .zRadioWrapper and then select children. Remove .zSelected from all .zRadio
44	$theClickedButton.toggleClass("zSelected");
45	$theClickedButton.find(':checkbox').each(function () { this.checked = !this.checked; $(this).change()});
46	});	
47	
48  
49  $.each($inputs,function(k,v){
50    if($(v).attr('checked')){
51      
52      $(v).parent().click();
53      
54    }
55    
56  });
57  
58}
59