Show/hide div if "other" radio OR checkbox is checked
<p>I realize this is not terribly different from a lot of other questions that have been asked, but it's the little differences that's making it tricky for me.</p>

<p>Basically, I want to show or hide the text input to specify the "other" option if "other" is checked.</p>

<p>My approach seems to work fine for the checkboxes. But the the other text input won't hide when you uncheck the other radio button. I know the nature of radios is a little different, but I'm not sure how to accommodate this.</p>

<p>Here's the code, and I've also created a <a href="http://jsfiddle.net/NQsJy/2" rel="nofollow">jsFiddle</a> where you can see it in action. Thanks for your help!</p>

<h2>HTML</h2>

<pre><code>&lt;fieldset&gt;
&lt;h1&gt;Pick One&lt;/h1&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="1" type="radio" name="options"&gt; Chicken&lt;/label&gt;&lt;/p&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="2" type="radio" name="options"&gt; Beef&lt;/label&gt;&lt;/p&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="3" type="radio" name="options"&gt; Fish&lt;/label&gt;&lt;/p&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="4" type="radio" name="options" class="other"&gt; Other&lt;/label&gt;&lt;/p&gt;
&lt;p class="specify-other"&gt;&lt;label&gt;Please specify: &lt;input name="options-other"&gt;&lt;/label&gt;&lt;/p&gt;
&lt;/fieldset&gt;

&lt;fieldset&gt;
&lt;h1&gt;Pick Several&lt;/h1&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="1" type="checkbox" name="food"&gt; Rice&lt;/label&gt;&lt;/p&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="2" type="checkbox" name="food"&gt; Beans&lt;/label&gt;&lt;/p&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="3" type="checkbox" name="food"&gt; Potatoes&lt;/label&gt;&lt;/p&gt;
&lt;p&gt;&lt;label&gt;&lt;input value="4" type="checkbox" name="food" class="other"&gt; Other&lt;/label&gt;&lt;/p&gt;
&lt;p class="specify-other"&gt;&lt;label&gt;Please specify: &lt;input name="options-other"&gt;&lt;/label&gt;&lt;/p&gt;
&lt;/fieldset&gt;
</code></pre>

<h2>jQuery</h2>

<pre><code>$('.other').click(function(){
    if ($(this).is(':checked'))
    {
        $(this).parents('fieldset').children(".specify-other").show('fast');
    } else {
        $(this).parents('fieldset').children(".specify-other").hide('fast');
    }
});
</code></pre>

<h2>CSS</h2>

<pre><code>.specify-other {display: none;}
</code></pre>
