Use jquery to display div based on radio button selected
<p>Here's the code for a simple page I have that is not working:</p>

<pre><code>    &lt;head&gt;
&lt;script src="js/jquery-1.7.min.js"&gt;&lt;/script&gt;

&lt;script type="text/javascript"&gt;
&lt;!--
$("input[type=radio]").on('click', function(){
    if ($('#radio1').is(':checked')){
        $("#grid_9.omega").slideDown("slow");
    } else { 
        $("#grid_9.omega").slideUp("slow");
    }
});
//--&gt;
&lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;
&lt;form id="form1" name="form1" method="post" action=""&gt;
  &lt;p&gt;
    &lt;label&gt;
      &lt;input type="radio" name="RadioGroup1" value="radio1" id="radio1" /&gt;
      Radio 1&lt;/label&gt;
    &lt;br /&gt;
    &lt;label&gt;
      &lt;input type="radio" name="RadioGroup1" value="radio2" id="radio2" /&gt;
      Radio 2&lt;/label&gt;
    &lt;br /&gt;
    &lt;label&gt;
      &lt;input type="radio" name="RadioGroup1" value="radio3" id="radio3" /&gt;
      Radio 3&lt;/label&gt;
    &lt;br /&gt;
  &lt;/p&gt;
&lt;/form&gt;
&lt;div id="grid_9" class="omega" style="display:none"&gt;show me when Radio 1 is chosen​&lt;/div&gt;
&lt;/body&gt;
</code></pre>

<p>My goal is to use jquery to display div "grid_9.omega" when "radio1" is selected, but have that div hidden when "radio1" isn't selected.</p>

<p>Advice?</p>
