title: javascript conditional statement for a group of radio buttons
body: <p>I want to make an online test, but i have some problems with the code below.</p>
  
  <p>I want it to mark the correct and wrong answers, and show the score, when the button is pressed.</p>
  
  <p>Now I have the following problem: I want the first switch statement to be only for the first group of radio buttons, the second switch statement for the second group of buttons, and so on.</p>
  
  <p>How could I do that? When I run the code now, the colors change even though none of the radio buttons is checked, or when a button in only one of the groups is checked.</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>function showScore() {
    var check;
    var total = 0;
    var yourmark = "your score is  ";
  
    switch (document.getElementById('q12').checked) {
      case true:
        total = total + 1;
        document.getElementById('text1').style.color = "green";
        break;
      case false:
        document.getElementById('text0').style.color = "red";
        document.getElementById('text2').style.color = "red";
        document.getElementById('text1').style.color = "green";
        break;
    }
    switch (document.getElementById('q13').checked) {
      case true:
        document.getElementById('text0.1').style.color = "green";
        total = total + 1;
        break;
      case false:
        document.getElementById('text1.1').style.color = "red";
        document.getElementById('text1.2').style.color = "red";
        break;
    }
  
    alert(yourmark + total);
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;input type="radio" name="question1" id="q11" value="false"&gt;
  &lt;text id="text0"&gt;Question 1-first option&lt;/text&gt;
  &lt;br&gt;
  &lt;input type="radio" name="question1" id="q12" value="true"&gt;
  &lt;text id="text1"&gt;Question 1- second option&lt;/text&gt;
  &lt;br&gt;
  &lt;input type="radio" name="question1" value="false"&gt;
  &lt;text id="text2"&gt;Question 1- third option&lt;/text&gt;
  
  &lt;br&gt;
  &lt;br&gt;
  
  &lt;input type="radio" name="question2" id="q13" value="false"&gt;
  &lt;text id="text0.1"&gt;Question 1-first option&lt;/text&gt;
  &lt;br&gt;
  &lt;input type="radio" name="question2" id="q12" value="true"&gt;
  &lt;text id="text1.1"&gt;Question 1- second option&lt;/text&gt;
  &lt;br&gt;
  &lt;input type="radio" name="question2" value="false"&gt;
  &lt;text id="text1.2"&gt;Question 1- third option&lt;/text&gt;
  &lt;br&gt;
  
  &lt;button onclick="showScore();"&gt;Show my score&lt;/button&gt;</code></pre>
  </div>
  </div>
  </p>