css - JavaScript: Change Class Style across various pages -

i trying create function allow me change color of div in footer on every page on mouseover.

this have come far , not working.

javascript:

function a(obj) {     var elements = document.getelementsbyclassname(obj)     var objects = []      (var i=0; < elements.length; ++i) {         objects.push(elements[i])     }     return objects; }  var footerdiv = a('footerdiv'); footerdiv.onmouseover = function() {     footerdiv.style.color = 'black'; }  footerdiv.onmouseout = function() {     footerdiv.style.color = 'white'; } 

html:

<div class="footerdiv">   example text </div>  

i'd css:

.footerdiv {     color: white; }  .footerdiv:hover {     color: black }