CodePen Embed - qBmMxXV

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Focus & Blur</title>
</head>
<body>
  <h2 id="title">Try</h2>
  <form>
    <input type="email" id="email-input" />
    <button type="submit">submit</button>
  </form>
</body>
</html>

input

const inputField = document.querySelector('#email-input');
const title = document.querySelector('#title');
inputField.addEventListener('blur', () => {
  title.textContent = 'blur';
  title.style.color = 'red';
} )

inputField.addEventListener('focus', () => {
  title.textContent = 'focus';
  title.style.color = 'blue';
})

This Pen is owned by AyaBouchiha on CodePen.

See more by @Aya_Bouchiha on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.