title: Toggle a <DIV> between Hide/Show using a RadioButton
body: <p>I would like a form with radio buttons with an underneath link of "more information" and, according to the selected button, to show this link more of the corresponding information.</p>
  
  <p>Here is my code. But it doesn't work :-(</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function(){
    $("div").hide();
  });
  
  $(document).ready(function(){
    if($('input:radio[name="tarif"][value="jour"]').prop('checked', true)){
      $("button").click(function(){
          $(".jour").toggle();
      });
    } else if($('input:radio[name="tarif"][value="nuit"]').prop('checked', true)){
      $("button").click(function(){
          $(".nuit").toggle();
      });
    }
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;INPUT type= "radio" name="tarif" value="jour"&gt; tarif de jour
  &lt;INPUT type= "radio" name="tarif" value="nuit"&gt; tarif de nuit
  &lt;a href=# class="info"&gt;More information&lt;/a&gt;
  &lt;div class="jour"&gt;
    &lt;p&gt;
      qedaqteeteataeteteat
    &lt;/p&gt;
  &lt;/div&gt;
  &lt;div class="nuit"&gt;
    &lt;p&gt;
      ZEFSZEFSGDHZEGSHGREZREGR
    &lt;/p&gt;
  &lt;/div&gt;
  &lt;button&gt;Toggle between hide() and show()&lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Please, can you help me?</p>