JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<form class="commentForm">
    <div id="inputs"></div>
    <input type="submit" /> <span id="addInput">add element</span>
</form>

JavaScript

$(document).ready(function () {
       /* MODE 1
       With [] or array name <<<< this one is not working
        $("#addInput").on('click', function () {
           $('#inputs').append($('<input class="comment" name="name[]" />'));
       });
       */
       
       /* MODE 2
       Without [] or array name <<<< this one is working
       var numberIncr = 1;

        $("#addInput").on('click', function () {
           $('#inputs').append($('<input class="comment" name="name' + numberIncr + '" />'));
           numberIncr++;
       });
       */

       $('form.commentForm').on('submit', function (event) {

           $('input.comment').each(function () {
               $(this).rules("add", {
                   required: true
               })
           });

           event.preventDefault();

           console.log($('form.commentForm').valid());
       })

       $('form.commentForm').validate();
   });