Edit in JSFiddle

$(function(){

  var regExp = /^\w*(\.\w*)?@\w*\.[a-z]+(\.[a-z]+)?$/;

  $('[type="email"]').on('keyup', function() {
    $('.message').hide();
    regExp.test( $(this).val() ) ? $('.message.success').show() : $('.message.error').show();
  });

});

<div>
  <input type="email" name="" placeholder="Digite seu Email">
  <span class="message success">Email válido!</span>
  <span class="message error">Tente novamente!</span>
</div>

html, body {
      height: 100%;
      min-height: 100%;
    }
    body {
      display:flex;
      justify-content: center;
      align-items: center;
      height: 100%;
      text-align: center;
    }

    div {
      width: 50%;
    }

    input {
      padding: 15px;
      width: 100%;
      font-size: 30px;
      text-align: center;
      border: 5px solid rgba(0, 0, 0, .3);
    }

    .message {
      font: 20px Helvetica, Arial, Sans-serif;
      padding: 20px;
      display: none;
      color: #fff;
      width: 100%;
    }

    .error {
      background: red;
    }

    .success {
      background: green;
    }