JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.7/jquery.validate.min.js"></script>
<form method="post" action="#" name="sf" id="sf">
    
    <p>
        <label for="name">Name:</label>
        <input type="text" name="name"  id="name"/><br />
    </p>
    
    <p>
        <label for="email">Email:</label>
        <input type="text" name="email"  id="email" /><br />
    </p>
    
    <input type="submit" />
    
</form>

JavaScript

$.validator.addMethod("legalname", function(value, element) {
    var i = /^bob$/i;
    return (!(i.test(value)));
}, "Invalid user name");

$("#sf").validate({
    rules: {
        name: {
            legalname: true
        }
    },
    errorPlacement: function(error, element) {
        element.closest("p").append(error);
    }
});