JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.aspnetcdn.com/ajax/jquery.validate/1.15.0/jquery.validate.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-validate/1.15.0/additional-methods.js"></script>
<div class="article_properties">
                        <form class="article_properties_form" action="" method="POST" enctype="multipart/form-data">
                        <p style="display: inline">Page Number</p>
                        <div style="background-color: #FF355E; padding: 5px; display: inline; margin-left: 5px">
                        
                        <p style="display: inline" class="pageNumber"></p>
                        </div>
                        <textarea style="display: none" class="inputNumber" name="pageNumber"></textarea>
                        <p>Image</p>
                        <input style="padding: 0px" type="file" name="image">
                            <p>Subtitle</p>
                            <input type="text" name="subtitle">

                            <p>Text</p>
                            <textarea name="text" rows="4"></textarea>
                            <input id="properties_btn" type="submit" value="Submit/Update">
                            <hr style="border: 1px dotted lightgray; margin-bottom: 50px">
                        </form>

                        

                    </div> <!--End of article properties div-->
				<div id="addOne"><p>+Add page</p></div>

JavaScript

$(".article_properties_form").validate({
		errorElement: 'div',
		rules: {
			image: {
				required: true,
				extension: "jpg,jpeg, png"
			},
			
			subtitle: {
				required: true,
				minlength: 2,
				maxlength: 25
			},
			text: {
				required: true,
				minlength: 35,
				maxlength: 275
			}
		},
		 
		messages: {
			image: {
				required: "This page needs an image",
				extension: "You're only allowed to upload jpg or png images."
			},
			
			subtitle: {
				required: "You have to provide a subtitle for this page!",
				minlength: "Your subtitle must be at least 2 characters long",
				maxlength: "Your subtitle must be less than 25 characters long"
			},
			text: {
				required: "Please enter text for this page",
				minlength: "Your text must be at least 35 characters long",
				maxlength: "Your text must be less than 275 characters long"
			},
		},
		 
		});

var numPages = 10;
$('.pageNumber').text(numPages);
$('.inputNumber').text(numPages);

$('#addOne').click(function()
            		{
			
	               		numPages--;
	               		
	               		if (numPages == 1)
	               		{
	               			var articlePropsTemplate = $('.article_properties_form:last').clone();	         
		                        $('.article_properties').append(articlePropsTemplate);	                       
		                        $('.pageNumber:last').text(numPages);
		                        $('.inputNumber:last').text(numPages);
		                         articlePropsTemplate[0].reset();
		                         add_validation_for_forms();

 					articlePropsTemplate.validate().resetForm();
		                        $('.nextBtn').fadeIn("slow");
		                        $('#addOne').hide();
	               		}
	               		
	               		else
	               		{
		                        var articlePropsTemplate = $('.article_properties_form:last').clone();
		                        $('.article_properties').append(articlePropsTemplate);
		      ...