title: How to keep the previous answer selected? (javascript quiz)
body: <p>My JavaScript quiz have both 'next' and 'previous' button. I want to keep the answers selected when I click the <strong>previous/next</strong> button. <br />
  Here is the      <a href="https://jsfiddle.net/sajibBD/4bnx8acw/1/" rel="nofollow">JsFiddle link</a> <br />
  The JavaScript I used to <strong>check</strong> answer:</p>
  
  <pre><code>var correct = 0;
  var pos = 0;
  var choice;
  var allQuestions = [
  {question:"What is 10 + 5?", choices:["15", "12", "10"], answer: "A" },
  {question:"What is 10 - 5?", choices:["5", "6", "8"   ], answer: "A" },
  {question:"What is 10 * 5?", choices:["50", "60", "70"], answer: "A" },
  {question:"What is 10 / 5?", choices:["1", "2", "3"   ], answer: "B" }
  ];
  
  function getID(x) {
  return document.getElementById(x)
  }
  
  function renderQuestions () {
  var testStatus = getID("test_status");
  var test = getID("test");
  if(pos &gt;= allQuestions.length) {
      testStatus.innerHTML = "Test Completed";
      test.innerHTML = "&lt;h2&gt;" + "You got " + correct  + " out of " +  allQuestions.length + "&lt;/h2&gt;&lt;br/&gt;";
      pos = 0;
      return false
  };
  testStatus.innerHTML = "Question " + (pos + 1) + " of " + allQuestions.length;
  
  var A = allQuestions[pos].choices[0];;
  var B = allQuestions[pos].choices[1];;
  var C = allQuestions[pos].choices[2];
  
  test.innerHTML = "&lt;h2&gt;" + allQuestions[pos].question  + "&lt;/h2&gt;&lt;br/&gt;";
  test.innerHTML += '&lt;input type="radio" value="A" name="answerChoice" /&gt; ' + A + '&lt;br /&gt;';
  test.innerHTML += '&lt;input type="radio" value="B" name="answerChoice" /&gt; ' + B + '&lt;br /&gt;';
  test.innerHTML += '&lt;input type="radio" value="C" name="answerChoice" /&gt; ' + C + '&lt;br /&gt;&lt;br /&gt;';
  if (pos == allQuestions.length - 1) {
      test.innerHTML += '&lt;input type="button" id="next" onclick="prevAnswer()" value="Prev"&gt; ';
      test.innerHTML += '&lt;input type="button" id="next" onclick="checkAnswer()" value="Submit"&gt; ';
  }
  else if (pos &gt;= 1) {
      test.innerHTML += '&lt;input type="button" id="next" onclick="prevAnswer()" value="Prev"&gt; ';
      test.innerHTML += '&lt;input type="button" id="next" onclick="checkAnswer()" value="Next"&gt; ';
  }
  else {
      test.innerHTML += '&lt;input type="button" id="next" onclick="checkAnswer()" value="Next"&gt; ';
  }
  
  test.innerHTML += '&lt;br /&gt;&lt;br /&gt;&lt;p id="error"&gt;&lt;/p&gt;'
  }
  
  choice = document.getElementsByName("answerChoice");
  var checkedAnswer = null;
  
  function checkAnswer() {
  
  choice = document.getElementsByName("answerChoice");
  var checkedAnswer = null;
  for (var i = 0; i &lt; choice.length; i++) {
      if(choice[i].checked) {
          checkedAnswer = choice[i].value;
      }
  }
  
  if( checkedAnswer == null ) {
      document.getElementById("error").innerHTML = 'Please select an answer'
      return false;
  }
  
  if (checkedAnswer == allQuestions[pos].answer){
      correct++
  }
  
  pos++
  renderQuestions()
  }
  function prevAnswer() {
  pos--
  renderQuestions()
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="header"&gt;Simple Quiz Application&lt;/div&gt;
  
  &lt;div id="test_status"&gt;&lt;/div&gt;
  &lt;div id="test"&gt;&lt;/div&gt;
  </code></pre>
  
  <blockquote>
    <p>I know this questioned had been asked before. But I am a beginner and that was programmed in a different way.</p>
  </blockquote>