Problems with CSS Styles: font-weight change but stoke and fill color won't!

The following javascript seems to work:

    document.styleSheets[0].cssRules[26].style.fontWeight ="bold";
    document.styleSheets[0].cssRules[27].style.fontWeight="light";

However, changing the color does not seem to work:

    document.styleSheets[0].cssRules[26].style.fill 
="black";document.styleSheets[0].cssRules[26].style.stroke ="black";
    document.styleSheets[0].cssRules[27].style.fill="grey";document.styleSheets[0].cssRules[27].style.stroke="grey";

Here are the declarations in my style:
<style>
...
text.common-up          { font-family:Arial Unicode MS; font-size:4pt; 
stroke:none; fill:black; font-weight:light; display; visibility:visible }
text.common-lo          { font-family:Arial Unicode MS; font-size:4pt; 
stroke:none; fill:black; font-weight:bold; display; visibility:visible }
</style>

Changing the fill color in the <style> section seems to work. Why cannot I 
change the color in the javascript?

Also: using hard coded integer literals for the array indices for cssRules 
is driving me nuts. If I change the order of the lines in my 
<style>...</style> it will really mess things up! I suppose I could define 
some symbolic integer constants in javascript (how do I do that?) but it 
would not prevent that havoc caused by inadvertantly transposing to style 
lines in the <style>...</style> section.

Also: can I use the same style for rects as I do paths as I do text? So far, 
the only way I can make things work is to define seperate entries in my 
<style> </style> section for text, paths, rects etc... This seems clumsy.

Thanks!
Siegfried