JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.1/jquery.validate.js"></script>
<form method="post" accept-charset="utf-8" id="submit-work-form" role="form" action="/" novalidate="novalidate">
<div class="form-group">
	<input type="hidden" name="image_count" required="required" data-rule-validcmsimagecount="true" aria-required="true">
  <div class="photos">
		<div class="photo-container"></div>
    <div class="photo-container"></div>
	</div>
</div>
<div class="submit"><input type="submit" class="btn btn-black btn-default" value="Submit"></div>
</form>

JavaScript

$.validator.addMethod("validcmsimagecount", function(value, element) {
      alert('Doesn\'t work');
			return $('.photo-container').length > 3;
		}, "You must add at least one image.");

		$('#submit-work-form').validate({
			submitHandler: function (form) {
				form.submit();
			}
		});