title: Show / Hide div based on Cookie Value
body: <p>I setup a form that people fill out. One of the form fields is a county dropdown.
  The form action creates a cookie: </p>
  
  <pre><code>setcookie("county", $county, time() + 3600 /* one hour */, '/', 'subdomain.mydomain.com', false, false);
  </code></pre>
  
  <p>On the confirmation page I have multiple divs that are hidden by default: </p>
  
  <pre><code>&lt;div id="county1"&gt;County 1 Content&lt;/div&gt;
  &lt;div id="county2"&gt;County 2 Content&lt;/div&gt;
  &lt;div id="county3"&gt;County 3 Content&lt;/div&gt; 
  </code></pre>
  
  <p>and so on... </p>
  
  <p>Based on the county the user selects from the select drop down on the previous page I want the particular div to to display. </p>
  
  <p>I tried: </p>
  
  <pre><code>&lt;div style="visibility: hidden"&gt;&lt;input id="county" name="county" value="&lt;?php echo($_COOKIE['county']); ?&gt;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and</p>
  
  <pre><code>$('#county').on('load', function () {
      if(this.value === "County1"){
          $("#county1").show();
      } else {
          $("#county1").hide();
      }
  }); 
  </code></pre>
  
  <p>but input doesn't seem to support onLoad. Any suggestions? </p>
  
  <p>Thanks!!</p>