title: Show or hide table row if checkbox is checked
body: <p>I want to hide a table row (with input fields inside) when a checkbox is checked.
  I found something that works:</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;table&gt;
      &lt;tr id="row"&gt;
          &lt;td&gt;&lt;input type="text"&gt;&lt;/td&gt;
          &lt;td&gt;&lt;input type="text"&gt;&lt;/td&gt;
      &lt;/tr&gt;
      &lt;tr&gt;
          &lt;td&gt;&lt;input type="checkbox" id="checkbox"&gt;Hide inputs&lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p><strong>Script</strong></p>
  
  <pre><code>$(document).ready(function () {
      $('#checkbox').change(function () {
          if (!this.checked) 
              $('#row').fadeIn('slow');
          else 
              $('#row').fadeOut('slow');
      });
  });
  </code></pre>
  
  <p><a href="http://jsfiddle.net/2ge9zusk/1/" rel="nofollow">Fiddle</a></p>
  
  <p>But this only works if the checkbox is not checked already. So if the checkbox is checked at the beginning, I want the table row to be hidden. How do I do this?</p>
  
  <p><em>Please note that I don't know much about JavaScript, but I really need this</em></p>