JSFiddle - React, Tailwind, and code Playground

HTML

<form class="contact-form">
    <label for="email">
         Email*
    </label>
    <input id="email" type="email" name="email" placeholder="example@emailserver.com" required>
        <span id="isValid"></span>
        <input type="button" value="submit" onclick=validate()>
    </form>

JavaScript

function validate() {
    var email = document.getElementById('email').value;
    var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
    
    var isValid = re.test(email);
    
    if (!isValid) {
        document.getElementById('isValid').style.background ='red';
        document.getElementById('isValid').innerHTML = 'NOT OK';
    }
    else {
        document.getElementById('isValid').style.background ='green';
        document.getElementById('isValid').innerHTML = 'OK';
    }
}