JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/jquery.validate.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.10.0/additional-methods.js"></script>
<form id="inscripcion">
    <input type="text" name="nombrer" />
    <br/>
    <input type="text" name="apellidor" />
    <br/>
    <input type="text" name="cedular" />
    <br/>
    <input type="submit" />
</form>
<a href="http://docs.jquery.com/Plugins/Validation" target="_blank">Validation Documentation</a>

CSS

a {
    display: block;
    position: absolute;
    bottom: 0;
}

JavaScript

$(document).ready(function () {

    jQuery.validator.addMethod("letras", function (value, element) {
        return this.optional(element) || value == value.match(/^[a-zA-Z ñÑáéíóúüç]+$/);
    }, "Only letters.");

    $('#inscripcion').validate({
        errorClass: 'form-control-error',
        validClass: 'form-control-sucess',
        ignore: [],
        submitHandler: function (form) { // for demo
            alert('valid form');
            return false;
        },
        rules: {
            nombrer: {
                minlength: 2,
                letras: true,
                required: true
            },
            apellidor: {
                minlength: 2,
                required: true
            },
            cedular: {
                minlength: 7,
                number: true,
                required: true
            }
        },
        highlight: function (element) {
            $(element).closest('.form-group').removeClass('has-success').addClass('has-error');
        },
        success: function (element) {
            $(element).closest('.form-group').removeClass('has-error').addClass('has-success');
        }
    });
    
});