JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://jqueryvalidation.org/wp-includes/js/jquery/jquery.js?ver=1.12.4"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.1/jquery.validate.js"></script>
<form id="testform" name="test-form" novalidate>
<input type="text" required name="test" /><br/>

<input type-="text" required name="test2" /><br/><br/>

<button name="test" id="resetForm">
Reset Form
</button>
<button name="test" type="submit" id="test-submit">Submit</button>
</form>

JavaScript

jQuery(document).ready(function() {
	jQuery('#test-submit').on('click', function(e) {
  	e.preventDefault();
  	jQuery('#testform').validate({
    	submitHandler: function(form) {
      	console.log('called');
      }
    }).resetForm();
    
  });
  
  jQuery('#resetForm').on('click', function() {
  	jQuery('#testform').resetForm();
  });
});