title: If certain radio buttons checked, display div else display different div?
body: <p>:) So I'm trying to create a user questionaire type form, it doesnt have to send to anyone just display a div once certain radio buttons are checked and if them certain radio buttons arent checked then display a different div, but also when the webpage opens/refreshes none of the div's I want to display to be displayed (if that makes sense?). I found some code on here to try but it didnt work for me, I'm a noob with JS &amp; Jquery but was hoping anyone could shed some light on my problem. please find my code below.</p>
  
  <p>Jquery?</p>
  
  <pre><code>if($('input[value=yes1]:checked,
   input[value=yes2]:checked, 
   input[value=yes3]:checked,
   input[value=yes4]:checked').length == 4){
  
  $("#correct").show();
  
   }else{
  
  $("#correct").hide();
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="row"&gt;
  &lt;div class="left"&gt;
  
      &lt;div class="right answer"&gt;
          &lt;div class="leftradio"&gt;
              &lt;input type="radio" id="yes1" value="yes1" name="iCheck1"&gt;
              &lt;label&gt;Yes&lt;/label&gt;
              &lt;/input&gt;
          &lt;/div&gt;
  
          &lt;div class="rightradio"&gt;
              &lt;input type="radio" id="no1" name="iCheck1"&gt;
              &lt;label&gt;No&lt;/label&gt;
              &lt;/input&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  
  &lt;/div&gt;
  &lt;div class="right"&gt;
  
      &lt;div class="right answer"&gt;
          &lt;div class="leftradio"&gt;
              &lt;input type="radio" id="yes2" value="yes2" name="iCheck2"&gt;
              &lt;label&gt;Yes&lt;/label&gt;
              &lt;/input&gt;
          &lt;/div&gt;
  
          &lt;div class="rightradio"&gt;
              &lt;input type="radio" id="no2" name="iCheck2"&gt;
              &lt;label&gt;No&lt;/label&gt;
              &lt;/input&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  
      
  
          
              
                  
                  Yes
                  
              
  
              
                  
                  No
                  
              
  
          
  
      
      
  
          
              
                  
                  Yes
                  
              
  
              
                  
                  No
                  
              
  
          
      
  
  
  <p>CSS</p>
  
  <pre><code>#correct{width:100%; height:50px; background:green; display:none;}
  #incorrect{width:100%; height:50px; background:red; display:none;}
  </code></pre>