css: changing the ruleset vs using selectors to switch classes/apply styles

[jithin]

Lately I wondered about editing elements styles not by switching their classes on dom, but by changing the actual ruleset for the css class or selector.So instead of something like\[code\]$('.some').hide()\[/code\]or\[code\]$('.some').addClass('hidden')\[/code\]Why not alter a rule directly with \[code\]document.styleSheets\[/code\] and stuff?Wouldn't this approach be generally more performant, at least with many elements, as we'd let the browser handle the ruleset changes natively?You could for example add an style to \[code\].some\[/code\], like \[code\]display: none;\[/code\] and all \[code\].some\[/code\] elements would be immedeatly be hidden. There is no need to iterate over all those elements in js and hide them manually(like the example above).Changing rulesets directly would more likely encourage classes that are context aware(or however you would call this..), as you'd hide all \[code\]#persons > .item\[/code\] or something.I still don't know best practices regarding classes that are named with context in mind, like for example control names like \[code\].calendar\[/code\] \[code\].ticket\[/code\] \[code\].item\[/code\], versus single functionality classes like \[code\].hidden\[/code\] \[code\].left\[/code\] \[code\].green\[/code\], as I usually need both types of conventions.I am just asking what you think about this and what are benefits and drawbacks of the modifiying stylesheet approach versus how libraries like jquery handle changing styles?Also, what do you think is good practice, what do you regard more as a hack?cough javascript and hacking cough