<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<label for="email">Entrez une adresse e-mail: </label>
<input id="email" />
<h2 id="res"></h2>
const validateEmail = (email) => {
  return email.match(
    /^(([^<>()[\]\\.,;:\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,}))$/
  );
};

const validate = () => {
  const $res = $('#res');
  const email = $('#email').val();
  $res.text('');

  if (validateEmail(email)) {
    $res.text(email + ' est valide.').css('color', 'green');
  } else {
    $res.text(email + ' n\'est pas valide.').css('color', 'red');
  }
  return false;
}

$('#email').on('input', validate);
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.