title: Change the background colour and hide the radio buttons within a particular divs when a checkbox is inactive
body: <p>Here is a <a href="http://jsfiddle.net/murshid1988/aMyLb/" rel="nofollow"><strong>JSFIDDLE</strong></a> to my code.</p>
  
  <p>Here, when the check box is unchecked I need to turn the back ground colour to white and hide the radio buttons.</p>
  
  <p>Meanwhile when it is checked I want to show the background colour as the current one and show the radio buttons</p>
  
  <pre><code> &lt;div class="newsletter-box"&gt;
       &lt;span class="bonus-credit-wrapper"&gt;
           &lt;input id="bonus-credit-checkbox" name="bonus-credit-checkbox" type="checkbox" value="" /&gt;
           &lt;label for="bonus-credit-checkbox" class="bonus-credit-checkbox-label"&gt;Your bonus credits&lt;/label&gt;
  
           &lt;span class="bonus-credit-description"&gt;
               Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis
           &lt;/span&gt;
       &lt;/span&gt;
  
       &lt;span class="newsletter-preference"&gt;
           &lt;span class="newsletter-preference-text"&gt;I prefer for:
           &lt;/span&gt;
  
           &lt;span class="gender-radio"&gt;
               &lt;input checked id="newsletter-male" name="newsletter-gender" type="radio"&gt;
               &lt;label for="newsletter-male"&gt;Women&lt;/label&gt;
           &lt;/span&gt;
           &lt;span class="gender-radio"&gt;
               &lt;input id="newsletter-female" name="newsletter-gender" type="radio"&gt;
               &lt;label for="newsletter-female"&gt;Men&lt;/label&gt;
           &lt;/span&gt;
  
    &lt;/span&gt;
  </code></pre>