JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://jzaefferer.github.com/jquery-validation/jquery.validate.js"></script>
<div id="invalid"></div>
<form action="" method="post" name="myform" id="myform">
    <input type="checkbox" name="group_list[]" value="1" />Group 1
    <br />
    <input type="checkbox" name="group_list[]" value="1" />Group 2
    <br />
    <input type="checkbox" name="group_list[]" value="1" />Group 3
    <br />
    <input type="checkbox" name="group_list[]" value="1" />Group 4
    <br />
    <input type="text" name="manual_group" value="" placeholder="Group Name"
    />
    <br />
    <textarea name="message" placeholder="Your Message"></textarea>
    <br />
    <input type="button" name="submit" value="Send Message" />
</form>

JavaScript

$(document).ready(function () {
       $("#myform").validate({
            debug: true,
           rules: {
               message: {
                   required: true,
                   minlength: 5,
                   maxlength: 753
               }
           },
          
           errorPlacement: function (error, element) {
               error.appendTo('#invalid');
           },
           messages: {
               message: {
                   required: "Enter your text message",
                   minlength: jQuery.format("Enter at least {0} characters"),
               }
           }
       });
   });