Javascript mudando CSS

Front-end
#1

Olá a todos,

Estou tendo um problemão com css. É o seguinte, eu preciso que quando o usuário passe o mouse por cima de um componente, o javascript altere seu css, do mesmo jeito com mouseout, eu fiz o seguinte codigo, mas não acontece nada.

           <af:selectOneChoice
                              onmouseover="this.size=this.options.length; this.setAttribute(\"styleClass\",\"comboOver\");"
                              onmouseout="this.size=1; this.setAttribute(\"styleClass\",\"comboOut\");">
            <af:selectItem label="Teste1" value="1"/>
            <af:selectItem label="Teste2" value="2"/>
            <af:selectItem label="Teste3" value="3"/>
            <af:selectItem label="Teste4" value="4"/>
          </af:selectOneChoice>

Alguem pode me ajuda?

#2

Eu também ja tentei assim:

                        <af:selectOneChoice 
                              onmouseover="this.size=this.options.length; this.styleClass=\"comboOver;\""
                              onmouseout="this.size=1; this.styleClass=\"comboOut;\"">
            <af:selectItem label="Teste1" value="1"/>
            <af:selectItem label="Teste2" value="2"/>
            <af:selectItem label="Teste3" value="3"/>
            <af:selectItem label="Teste4" value="4"/>
          </af:selectOneChoice>

Só que nada acontece… primeiramente, eu pensei que o estilo tava errado, mas ele da certo se eu fizer:

                        <af:selectOneChoice

styleClass=“comboOver”
onmouseover=“this.size=this.options.length; this.styleClass=“comboOver”;”
onmouseout=“this.size=1; this.styleClass=“comboOut;””>
<af:selectItem label=“Teste1” value=“1”/>
<af:selectItem label=“Teste2” value=“2”/>
<af:selectItem label=“Teste3” value=“3”/>
<af:selectItem label=“Teste4” value=“4”/>
</af:selectOneChoice>

#3