javascript动态改变style里的样式

< STYLE TYPE ="text/css" >
.redText { color : red ; }
#pid { color : red ; }
</ STYLE >
< P id ="redText" CLASS ="redText" > 11 </ p >
< P id ="pid" > 22 </ p >
< input type ="button" onclick ="test()" value =" test " />
< script language ="javascript" type ="text/javascript" >
function test()
{
    var ss = document.styleSheets[ 0 ];
    var rules = ss.rules ? ss.rules:ss.cssRules
    for ( var i = 0 ;i < rules.length;i ++ )
    {
        if (rules[i].selectorText == " #pid " )
        {
            rules[i].style.color = " yellow " ;
        }
    }
   
   
}
</ script >