title: How do I make a div hidden by default using javascript?
body: <p>I am using the following code to toggle visibility of a div area:</p>
  
  <pre><code> &lt;script type="text/javascript"&gt;
  function toggle_visibility(id) {
     var e = document.getElementById(id);
     if(e.style.display == 'block')
        e.style.display = 'none';
     else
        e.style.display = 'block';
  }
   &lt;/script&gt;
  </code></pre>
  
  <p>To toggle it, I am using onclick="toggle_visibility('id_of_element_to_toggle');"</p>
  
  <p>The part that I don't like is that this makes it visible by default when the page loads.  How can I make it hidden by default until it is toggled to be visible?  I'd like to do this in the same javascript block if possible.  The simpler the better.</p>
  
  <p>How can I toggle the visibility of 2 divs at once?  To make them switch.</p>