Event delegation

by Rishi Gautam

HTML

<!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/Events/focus -->

<form id="form">
  <input type="text" placeholder="text input">
  <input type="password" placeholder="password">
</form>

JavaScript

var form = document.getElementById("form");
form.addEventListener("focus", function( event ) {
  event.target.style.background = "#77dd77";    
}, true);
form.addEventListener("blur", function( event ) {
  event.target.style.background = "";    
}, true);