<div id="results"></div>
let result = document.querySelector("#results");
function divLog(s) {
  result.innerHTML += s + '<br/>';
}

let emailField = document.createElement('input');
emailField.type = 'email';
let tests = [
  "foo@foo.com",
  "foo",
  "goo@goo.com",
  "zoo"
];

tests.forEach(t => {
  emailField.value = t;
  divLog(`Is ${t} a valid email? ${emailField.checkValidity()}`);
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.