title: show div only on dropdown selection and keep it after page refresh
body: <p>I want to keep after refreshing page, a div that show only on dropdown selection</p>
  
  <p>this is my demo <a href="http://jsfiddle.net/QTdS4/" rel="nofollow">http://jsfiddle.net/QTdS4/</a></p>
  
  <p>Now its working but if I refresh the page and the company was selected the additional field is not showing, I have to select the first option than reselect the company option in order for the additional field to show</p>
  
  <p>what I want to do is to keep the additional field if the user selected company and refreshed the page.</p>
  
  <p>here is my ht ml structure</p>
  
  <pre><code>&lt;select name="agencyselect" id="agencyselect"&gt;
  &lt;option value="0" selected="selected"&gt;Agency&lt;/option&gt;
  &lt;option value="1"&gt;Company&lt;/option&gt;
  &lt;/select&gt;
  &lt;div class="control-group" id="companyname" style="display:none;"&gt;
      &lt;label class="control-label" for="companyname"&gt;Company Name&lt;/label&gt;
      &lt;div class="controls"&gt;
          &lt;input id="s_companyname" type="text" name="s_companyname" value="" /&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>and my javascript</p>
  
  <pre><code>    window.onload = function () {
      document.getElementById('agencyselect').addEventListener('change', function () {
          if (this.value == 1) {
              document.getElementById('companyname').style.display = 'block';
          } else {
              document.getElementById('companyname').style.display = 'none';
          }
      }, false)
  };
  </code></pre>
  
  <p>note that I do not want to use jquery</p>
  
  <p><strong>demo:</strong> <a href="http://jsfiddle.net/QTdS4/" rel="nofollow">http://jsfiddle.net/QTdS4/</a></p>