Javascript/Jquery: Show a hidden div based on a Radio box select
<p>What I'm doing is building a form, where when you select one answer a bunch of new questions pop up. </p>

<p>This is my working code: </p>

<pre><code>$(".appliedWorked").click(function(){
   if($(this).val()==="appliedWorkedYes") 
      $(".appliedWorkedYesHide").show("fast"); 
   else 
      $(".appliedWorkedYesHide").hide("fast");
});
</code></pre>

<p>It works for only 1 class. I want to do this for many classes, so I thought I'd stick it into an array. </p>

<p>Here's my code for many classes but it's not showing when I hit yes on a radio box: </p>

<pre><code>// storing an array of radio boxe class names
var radioBoxArray = new Array(
        "appliedWorkedYes",
        "workStudyYes",
        "workHistoryYes",
        "workWeekEndsYes",
        "cprYes",
        "aedYes",
        "aidYes",
        "wsiYes",
        "gaurdYes"
        );

// looping over the radio box array, too use the show feature of jquery
for(var j = 0; j &lt; radioBoxArray.length; j++){
    // class name
    $("."+radioBoxArray[j]).click(function(){
        // value box
        if($(this).val()==='"+radioBoxArray[j]+"') 
            // show method
            $("."+radioBoxArray[j]+"Hide").show("fast"); 
        // hide else 
        else $("."+radioBoxArray[j]+"Hide").hide("fast");

    });

}
</code></pre>

<p>I think the issue is: </p>

<pre><code>if($(this).val()==='"+radioBoxArray[j]+"') 
</code></pre>

<p>Please help! </p>

<p>I've tried the following but will not show when I click on a box: </p>

<pre><code>if($(this).val()=== radioBoxArray[j])

if($(this).val()=== String( radioBoxArray[j] ))

if($(this).val()==='"'+radioBoxArray[j]+'"')
</code></pre>
