CSS verliert(?) :hover bei JS

Ich hab da paar tab buttons bei denen ich mit :hover den Background ändere.
Klappt auch, klar.
Aber sobald ich mit JS den Background einmal geändert hab, ist der :hover Effekt weg

CSS:

.tab_button{
        padding:4px;
        margin-top:10px;
        display:inline-block;
        background:#131313;
        border-radius:4px;
        box-shadow:3px 3px 5px 0px #000000 inset,
        1px 1px 3px 0px #4D4D4D;
    }
    .tab_button:hover{
        background:#53A1DE;
    }

JS:

function changeBGColorByClass(classname,color){
           	var el = document.getElementsByClassName(classname);
           	for(var i = 0; i < el.length; i++){
                el[i].style.background = color;
           }
        }

JS nutze ich eigentlich nur um den Background wieder zurück zu setzen, da die Seite nicht neu lädt.
Hab ich da nen Fehler oder kann ich den BG evtl auch ohne JS wieder zurück setzen?

Also geht :hover verloren?
Das is ja Mist. Ich wollte so wenig wie möglich JS nutzen. So müsste ich ja jetzt hover komplett über JS machen (onmouseover ...).

Oder fällt Dir ne Möglichkeit ein, den Hintergrund in CSS zu schreiben?

Das geht !!!!!!
Danke! =)