JSFiddle - React, Tailwind, and code Playground
HTML
<input type="email" name="emailaddress" id="valid_email"><div class="validate">Please enter a valid email!</div>
JavaScript
$('.validate').hide();
$('body').on('blur', '#valid_email', function() {
$('.validate').hide();
if(!isValidEmailAddress($(this).val())) {
$('.validate').show();
}
});
function isValidEmailAddress(emailAddress) {
var pattern = new RegExp(/^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/i);
return pattern.test(emailAddress);
};