title: Hide element by class (only Javascript, no Jquery)
body: <p>I would like to hide Elements by class name. I found a working example that runs outside of a function. However, when I use onClick it doesn't seem to work anymore.
  Please take a look at the following example: <a href="http://jsfiddle.net/SkfDz/9/" rel="nofollow">http://jsfiddle.net/SkfDz/9/</a>
  Can anyone please help me?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input class="" name="options" id="opt1" type="radio" onClick="hideToday()"/&gt;&lt;label for="opt1"&gt;Hide today&lt;/label&gt;
  &lt;input class="" name="options" id="opt1" type="radio" onClick="hideToday()"/&gt;&lt;label for="opt1"&gt;Hide today&lt;/label&gt;
  
  &lt;div class="today"&gt;TODAY&lt;/div&gt;
  &lt;div class="today"&gt;TODAY&lt;/div&gt;
  &lt;div class="today"&gt;TODAY&lt;/div&gt;
  
  &lt;div class="tomorrow"&gt;TOMORROW&lt;/div&gt;
  </code></pre>
  
  <p>Script:</p>
  
  <pre><code>function hideToday() {
      var todayElements = document.getElementsByClassName('today'), i;
      for (i = 0; i &lt; todayElements.length; i += 1) {
      todayElements[i].style.display = 'none';
      };
  };
  
  var tomorrowElements = document.getElementsByClassName('tomorrow'), i;
  for (i = 0; i &lt; tomorrowElements.length; i += 1) {
      tomorrowElements[i].style.display = 'none';
  }
  </code></pre>