title: How to apply style to a class in javascript?
body: <p>I have multiple divs in my body which need the same style:</p>
  
  <pre><code>&lt;div class="box"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I have a javascript that calculates the height of the browser window viewport height.
  I want to apply that height to all my "box" classed divs.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  var box = document.getElementsByClassName('box')[0];
  var height = (window.innerHeight) ? window.innerHeight: document.documentElement.clientHeight;
  box.style.height=(height)+'px';
  &lt;/script&gt;
  </code></pre>
  
  <p>This works, but only with one div, it doesn't make the second "box" div the same height as the previous. If I change the number in square brackets from 0 to 1 it applies the height to the second div. Also, if I make a second copy of the javascript so that the first script has [0] and the second [1] it applies the height to both divs. I can't delete the square brackets because then the javascript doesn't work at all. I have also tried to get the name with getElementsByTagName with no success.</p>
  
  <p>How can I make this javascript apply the same height to all the divs with "box" class? Or is there another way to do what I try to do?</p>