addEventListener

 
<!DOCTYPE HTML>
<html>
<head>
<title>Example</title>
<style type="text/css">
p {
  background: gray;
  color: white;
  padding: 10px;
  margin: 5px;
  border: thin solid black
}
</style>
</head>
<body>
  <p>This is a test.</p>
  <p id="block2">This is a test.</p>
  <button id="pressme">Press Me</button>
  <script type="text/javascript">
    var pElems = document.getElementsByTagName("p");
    for ( var i = 0; i < pElems.length; i++) {
      pElems[i].addEventListener("mouseover", handleMouseOver);
      pElems[i].addEventListener("mouseout", handleMouseOut);
    }
    document.getElementById("pressme").onclick = function() {
      document.getElementById("block2").removeEventListener("mouseout",handleMouseOut);
    }
    function handleMouseOver(e) {
        e.target.innerHTML += "mouseover";
      e.target.style.background = 'red';
      e.target.style.color = 'black';
    }
    function handleMouseOut(e) {
        e.target.innerHTML += "mouseout";
      e.target.style.removeProperty('color');
      e.target.style.removeProperty('background');
    }
  </script>
</body>
</html>
Click to view the demo