JSFiddle - React, Tailwind, and code Playground

HTML

<form>
	<input type="email" required>
	<button>
		Klick mich
	</button>
</form>

CSS

input[type='email']:invalid {
    border: 2px solid red;
}

JavaScript

document.querySelector('button').onclick = function() {
	inp = document.querySelector('input');
    if (inp.validity.valid) {
            alert("Valid entry: " + inp.value);
        } else {
            alert("Invalid entry: " + inp.value);
        }
}