JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/additional-methods.min.js"></script>
<form>
    
<ol class="MutColor13 mouseOver">
    <li class="rightCol">
        <strong>
            <label for="iEmailReply">Mail 1</label>
        </strong>
        <input id="iEmailReply" name="EmailReply" type="text" class="email" required="required" />
    </li>
    <li class="leftCol">
        <strong>
            <label for="iEmailFrom">Mail 2</label>
        </strong>
        <input id="iEmailFrom" name="EmailFrom" type="text" class="email" required="required" />
    </li>
</ol>
    
<div class="buttonBlock rightButton"  data-bind="fadeVisible: validateMessage()">
    <a class="MutButton3 toSave" data-bind="click: saveMessage"><span class="MutButton3">submit button</span></a>
</div>
   
<form>

JavaScript

$(document).ready(function () {
      var validateOptions = {
          ignore: [":hidden:not(required)"],
          focusCleanup: true,
          onsubmit: true
     };

     $.validator.setDefaults(validateOptions);

        var validatorInst = $('form').validate()

        $('form').bind('change oninput', function (event, element) {
            console.log('formLive :: ', $(event));
          
            if ($('form').valid() === true && $(element).not('.resetForm')) $('.toSave').show();
            else if ($(element).not('.resetForm')) $('.toSave').hide();
        });

  });