title: Hide/Show Div on Radio Selection
body: <p>I would like to hide/show a div based on radio selction.</p>
  
  <p>-On page load the div is hidden and radio "yes" is selected.</p>
  
  <p>-If user selects radio "no" the div would appear.</p>
  
  <p>-If the user then rechecks "yes" the div would hide again.</p>
  
  <p>Could anyone show me how this would work?</p>
  
  <p>The html:</p>
  
  <pre><code>&lt;table width="450px" border="0" cellspacing="0" cellpadding="0"&gt;
      &lt;tr&gt;
      &lt;td width="200px" style="padding-top:3px; padding-left:3px;"&gt;&lt;strong&gt;Deliver Immediately?&lt;/strong&gt;
      &lt;input type="radio" name="imm" id="delivernow" checked="true" /&gt;Yes
      &lt;input type="radio" name="imm" id="deliverlater" /&gt;No
      &lt;/td&gt;   
      &lt;td width="140px"&gt;       
              &lt;div name="datediv"&gt;
                  &lt;label for="date"&gt;Select date:&lt;/label&gt;
                  &lt;input type="Text" id="date" maxlength="25" size="25"/&gt;
                  &lt;img src="images/cal.gif" onclick="javascript:NewCssCal('date','ddMMyyyy','arrow',true,'12','','future')" style="cursor:pointer"/&gt;
              &lt;/div&gt;
      &lt;/td&gt;       
      &lt;/tr&gt;
  &lt;/table
  </code></pre>