Untitled

<body>
<div id="top" class="change">
<p> Microsoft </p>
<p> Apple </p>
<p> Sony </p>
</div>

<div id="middle">
<p> UBC </p>
<p> SFU </p>
<p> Langara </p>
</div>

<div id="bottom" class="change">
<p> Claire </p>
<p> Tori </p>
<p> Nancy</p>
</div>
</body>

<script>
var changeFont = document.getElementsByTagName("p"); // need change this!

for (let i = 0; i < changeFont.length; i++) {
        changeFont[i].onmouseover=function() {
            this.style.color = "red";
        }
    }

    for (let i = 0; i < changeFont.length; i++) {
        changeFont[i].onmouseout=function() {
            this.style.color = "black";
        }
    }
</script>