title: Reset values and make visiable for all elements associated to the radio button group member selected
body: <p>We all know only one in a radio button group (radio with the same name) can be selected, but my app needs to show/hide content in a block (may have nested elements in the block) based on the selected radio button. </p>
  
  <p><strong>Question</strong>: How can I create an algorithm using jQuery that will show content in a block when the radio button is selected and hide that content when a different radio button is selected? </p>
  
  <p><em>Algorithm</em>: any one of radio1, radio2, …and radioN of the same name been selected, Flip(classname,id) needs to make all elements visible &amp; value reset in the classname passed, and invisible all the other except id passed in.</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
    function Flip(classname,id) {
      //this javascript function will make 
      //    1) id of the given classname visible, 
      //    2) and reset &amp; invisible all the rest (all div elements of the given classname except id invisible
  
  }
  
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  Requestor:&lt;input type="radio" name="Req" onclick="Flip('RadioClass','radioDIV1');" /&gt;&lt;br /&gt;
  &lt;div class="RadioClass" id="radioDIV1" style="display:none;" &gt;
      Requestor 1234:
      &lt;div &gt;
          decendant level1a:
      &lt;/div&gt;
  &lt;/div&gt;
  Submitter:&lt;input type="radio" name="Req" onclick="Flip('RadioClass','radioDIV2');" /&gt;&lt;br /&gt;
  &lt;div class="RadioClass" id="radioDIV2" style="display:none;"&gt;
      Submitter 567:
      &lt;div &gt;
          decendant level1b:
      &lt;/div&gt;
  &lt;/div&gt;
  ForInfo:&lt;input type="radio" name="Req" onclick="Flip('RadioClass','radioDIV3');" /&gt;&lt;br /&gt;
  &lt;div class="RadioClass" id="radioDIV3" style="display:none;" &gt;
      ForInfo 89:
  &lt;/div&gt;
  &lt;/body&gt;
  </code></pre>