title: jQuery radio onchange toggle class of parent element?
body: <p>Please have a look on the following:</p>
  
  <pre><code>$('#myRadio').change(function() {           
  
      if($(this).is(':checked'))  {
          $(this).parent().addClass('green');
      } else {                              
          $(this).parent().removeClass('green');
      }
  });
  </code></pre>
  
  <p>Markup lookslike somewhat as following</p>
  
  <pre><code>&lt;table&gt;
    &lt;tr&gt;
      &lt;td&gt;Some text 1 &lt;/td&gt;
      &lt;td&gt;&lt;input type="radio" value="txt1" name="myRadio" id="text1" /&gt;&lt;/td&gt;
      &lt;td&gt;Some text 2 &lt;/td&gt;
      &lt;td&gt;&lt;input type="radio" value="txt2" name="myRadio" id="text2" /&gt;&lt;/td&gt;
      &lt;td&gt;Some text 3 &lt;/td&gt;
      &lt;td&gt;&lt;input type="radio" value="txt3" name="myRadio" id="text2" /&gt;&lt;/td&gt;
    &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>When I switch radio, above javascript code applies 'green' to TD tag, which is fine. But if I change the selection to another it adds the green to another but doesnt remove the green from the previously selected radio. </p>
  
  <p>How do I make it work so that selecting a radio option changes its parent TD's class to green and selecting another will reset all but add green to only the newly selected!</p>
  
  <p>Can it also be made to change class of its first previous TD which contains "some text 3" etc??</p>
  
  <p>Thanks.</p>