JSFiddle - React, Tailwind, and code Playground

by Sean Wessell

HTML

<script src="//code.jquery.com/jquery-2.1.4.min.js"></script>
<div class="parent">
  <input type="text" value="617-999-999" id="interested-number-form" />
</div>

<label></label>

JavaScript

var $atj = $;

function verfiyFields() {
  var reg = /^\D*(?:\d\D*){10}$/;
  var number = $atj('#interested-number-form');

  var flag = reg.test(number.val())

  if (!(flag)) {
    number.parent().append('<p class="form-error">Please enter a valid 10 digit phone number</p>');
  }

  return flag;
}

$atj('#interested-number-form').on('input change paste', function () {
  $(this).parent().find('.form-error').remove();
  if (verfiyFields()) {
    $(this).parent().find('.form-error').remove();
  }
})