JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://jquery.bassistance.de/validate/jquery.validate.js"></script>
<form id="form_master">
	<div id="col3" class="sameHeightCol">
		<div id="accordion">
			<h3>
				<a href="#" class="accordionA">Publication</a>
			</h3>
			<div id="actu_fieldset_publication">
				<p>
					<input type="submit" class="myButton_grey" value="Enregister en Brouillon" id="Bt_brouillon" />
				</p>
				
			</div>
			<h3>
				<a href="#" id="categorieLibelle" class="accordionA">Catégorie</a>
			</h3>
			<div id="cate_list"></div>
			</div>

	</div>
</form>

JavaScript

$(document).ready(function () {
    //$("#accordion").accordion({ autoHeight: true, navigation: true, });
    $.validator.setDefaults({
		submitHandler: function() {
			alert("submitted!");
		}
    });
	
    
	var listeCategorie = new Array() 
	listeCategorie.push("toto")
	listeCategorie.push("tata")
	listeCategorie.push("titi")
	var outPut = "";

           
	outPut+="<ul id='listeCategories'>";
			  for(i=0; i<listeCategorie.length; i++) {
			  outPut += "<li><input type='radio' name='categorie' value='"+i+"' />"+listeCategorie[i]+"</li>";
	}
	outPut += "</ul>"

	$("#cate_list").html(outPut)
		  
	$("#form_master").validate({
		rules: {
			categorie: "required"
		},
		errorPlacement: function (error, element) {
			if (element.is(":radio"))
				error.appendTo(element.parent().next().next());
		}
	});
	
});