JSFiddle - React, Tailwind, and code Playground

HTML

<div id="status"></div>

<input type="text" maxlength="128" size="60" value="" id="user_email" class="user-send-email float-right form-text" placeholder="Enter email (optional)" name="email">


<div class="masked-check">
    <div class="form-item form-type-checkbox form-item-stay-anonymous">
 <input type="checkbox" class="form-checkbox" value="1" name="stay_anonymous" id="edit-stay-anonymous">  <label for="edit-stay-anonymous" class="option"><i class="icon-ok"></i><span>Stay Anonimous</span> </label>

</div>
</div>

CSS

.masked-check { display: none }

JavaScript

function validateEmail() {

    var validEmail = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    if (validEmail.test($('#user_email').val())) {
        $('.masked-check').fadeIn(300);
        $('#status').html('Valid Email!');
    }
    else {
        $('.masked-check').fadeOut(300);
        $('#status').html('INVALID Email!');
    }

}

$('#user_email').keypress(function() {
    validateEmail();
});