Reddit question

by jonahe

HTML

<div>
  <h1 onmouseenter="window.handleMouseEnter()" onmouseleave="window.handleMouseLeave()">
  Hover here
  </h1>
  <h2 id="change_me">
    Change here
  </h2>
</div>

CSS

.blue {
  background-color: lightblue;
}

JavaScript

window.handleMouseEnter = function() {
	var elementToChange = document.querySelector('#change_me');
  elementToChange.className = 'blue';
}

window.handleMouseLeave = function() {
	var elementToChange = document.querySelector('#change_me');
  elementToChange.className = '';
}