Modify global CSS using Javascript?

Asked Sep 20 '14 at 21:55

Active Sep 20 '14 at 21:57

Viewed 66 times

I know it's possible to modify an element's style attribute using JavaScript, but is it possible to modify the global CSS rule itself? Take the following example:

$('div.test').css('display', 'none');

That modifies all pre-existing elements matching:

<div class="test"></div>

If this script were executed while a page was half loaded the DOM tree would not be complete and any matching elements not loaded wouldn't have this styling rule applied. Is there a way to modify the actual div.test rule itself using JavaScript?

By the way, I do have my own solution to this and am not asking for any workarounds. I would just like to know if this in particular is possible since I've never seen it done before.

edited Sep 20 '14 at 21:57

ne1410s

6,864
6
55
61

asked Sep 20 '14 at 21:55

Bryan Way

1,903
3
17
27

Why not just `$('.test').hide();` – jagmitg Sep 20 '14 at 21:57
The key is that not all elements are loaded into the DOM yet. – Bryan Way Sep 20 '14 at 21:58
That would work if the page were already loaded in memory. – Bryan Way Sep 20 '14 at 21:59
$("head").append("") – dandavis Sep 20 '14 at 23:56

Modify global CSS using Javascript?

0 Answers0