title: Jquery If Statement - Toggle Functions
body: <pre><code>                    $(document).ready(function() {
  
              $("span#label_Flat").hide();
              $("span#added_Flat").hide();
              $("span#removed_Flat").hide();
  
  
  
              if ($('#Flat:checked').val() != false) {
  
                  $('#Flat').click(function() {
                      $("span#label_Flat").toggle();
                      $("span#removed_Flat").toggle();
  
                  });
  
              } else {
  
                  $('#Flat').click(function() {
                      $("span#label_Flat").toggle();
                      $("span#added_Flat").toggle();
  
              });                 
          });
  </code></pre>
  
  <p>Can anyone point me in the direction of why this isnt working?</p>
  
  <p>I want to hide three span and only toggle two of them to be visible depending on if the checkbox is checked or not.</p>
  
  <p>Currently, the span are not hidden, and therefore do not toggle between hide and show as they should.</p>
  
  <p>The html is:</p>
  
  <pre><code>&lt;input id="Flat" type="checkbox" name="Flat" checked /&gt;
  
  
  &lt;p&gt;
  &lt;span id="label_Flat"&gt;Flat: &lt;/span&gt;
  &lt;span id="added_Flat"&gt;Added&lt;/span&gt;
  &lt;span id="removed_Flat"&gt;Removed&lt;/span&gt;
  &lt;/p&gt;
  </code></pre>
  
  <p>Thanks in advance for help.</p>
  
  <p>Example can be seen here: <a href="http://jsfiddle.net/WEq5u/10/" rel="nofollow">http://jsfiddle.net/WEq5u/10/</a></p>