title: How to change style of a class without JQuery
body: <p>Suppose to have about 2000 elements in a page like</p>
  
  <pre><code>&lt;div class="good"&gt;fruit&lt;/div&gt;
  &lt;div class="bad"&gt;stone&lt;/div&gt;
  &lt;div class="bad"&gt;sand&lt;/div&gt;
  &lt;div class="good"&gt;water&lt;/div&gt;
  &lt;div class="good"&gt;carrot&lt;/div&gt;
  </code></pre>
  
  <p>and style is</p>
  
  <pre><code>.good { color: green }
  .bad  { color: red }
  </code></pre>
  
  <p>I want to change css "color" value of classes "good" and "bad" without iterate getElementsByClassName. E.g. something like (invented)</p>
  
  <pre><code>document.class["good"].style.color="yellow"
  </code></pre>
  
  <p>I didn't find any way to change class definition in order to let all tags marked with that class change style: do it exists? Is it possible? </p>
  
  <p>MANDATORY: I {don't want, can't} use jQuery.</p>
  
  <p><strong>EDIT:</strong> I need to do it via Javascript, or find a way to change a attribute of whole class so that whole page is affected by change <strong>at the same time</strong> (I repeat, without iteration over document.getElementsByClassName("good")). I mean, I don't want use getElementsByClassName. I want that style element "color" is changed for class "good" so that "good" class has color "yellow" instead than "green". I don't want to change style of elements of document with that class, I want to change style of class. Is it possible? Thank you</p>