<style>
  .invalid { border-color: red; }
  #error { color: red }
</style>

Your email please: <input type="email" id="input">

<div id="error"></div>

<script>
input.onblur = function() {
  if (!input.value.includes('@')) { // ليس بريدا الكترونيّا
    input.classList.add('invalid');
    error.innerHTML = 'Please enter a correct email.'
  }
};

input.onfocus = function() {
  if (this.classList.contains('invalid')) {
    // أزل إشارة “الخطأ”، لأنّ المستخدم يريد إعادة إدخال شيء ما
    this.classList.remove('invalid');
    error.innerHTML = "";
  }
};
</script>