JSFiddle - React, Tailwind, and code Playground
HTML
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<form>
<input name="one" id="one" class="required" />
<label data-message="* this is required" for="one" class="error valid"></label>
<input name="Text1" id="Text1" class="required" />
<input name="Text2" id="Text2" class="required" />
<input name="Text3" id="Text3" class="required" />
<input type="submit" name="submit" value="Send Message" />
</form>
CSS
input {float:left; clear:left;}
label {float:left;}
label.error { color: Red; }
label.valid { color: Blue; }
JavaScript
$('label[data-message]').each(function () {
$(this).html($(this).data("message"));
});
$("form").validate({
success: function (label) {
if (label.data("message")) {
label.addClass("valid").text(label.data("message"));
} else {
label.text("");
}
},
submitHandler: function () {
alert('form is ok');
}
});