title: How to hide labels in html
body: <p>I have this code which depends on this javascript from dynamic drive:
  <a href="http://dynamicdrive.com/dynamicindex16/formdependency.htm" rel="nofollow noreferrer">http://dynamicdrive.com/dynamicindex16/formdependency.htm</a>
  Its a form dependency manager. Which will show or hide elements depending on what you choose from the forms that are revealed:</p>
  
  <p>I don't know why but If I alter the code from this:</p>
  
  <pre><code>&lt;td&gt;
         &lt;label&gt;ID Number&lt;input type="checkbox" name="id" class="DEPENDS ON info BEING student"&gt;&lt;/label&gt;
             &lt;/td&gt;
          &lt;/tr&gt;
  </code></pre>
  
  <p>To this:</p>
  
  <pre><code>    &lt;td&gt;
      &lt;input type="checkbox" name="id" class="DEPENDS ON info BEING student"&gt;&lt;label&gt;ID Number&lt;/label&gt;
         &lt;/td&gt;
      &lt;/tr&gt;
  </code></pre>
  
  <p>Note: The only change that I did here is to transfer the label from the left side of the checkbox to the right side so that they will look better.
  But when I do this. The labels will be visible even if I did not yet click on the button that will make it visible(but without the checkboxes).</p>
  
  <p>And when I click on that button, that's the only time when the checkbox will appear on the left side of the labels.</p>
  
  <p>The checkbox is ok, but the label is not. And the javascript is working properly.
  What do I do so that the checkbox and label will go together?</p>