can a checkbox be used as a multiple bookmark for saving an array value in multidimensional

while making a quiz application in javascript I am stuck at a place where i am not able to make bookmark to review question for example if a user is on question no 3 and he checks the checkbox it should reflect in question palet with a sign ❗ beside the respective number.

please also help me with the timer code if any appropriate code other than what i have used.

Thank You.

var questions = [
  ["q1", "1", "2", "3", "4", "5", "A", "not"],
  ["q2", "10", "20", "30", "40", "50", "B", "not"],
  ["q3", "10", "20", "30", "40", "50", "C", "not"],
  ["q4", "10", "20", "30", "40", "50", "D", "not"]
];

var pos = 0,
  choice, correct = 0,
  rscore = 0;

window.onload = function() {
  qus();
  // setQuestionOrder()
}

function qus() {
  document.getElementById("question").innerHTML = questions[pos][0];
  document.getElementById("c1").innerHTML = questions[pos][1];
  document.getElementById("c2").innerHTML = questions[pos][2];
  document.getElementById("c3").innerHTML = questions[pos][3];
  document.getElementById("c4").innerHTML = questions[pos][4];
  document.getElementById("c5").innerHTML = questions[pos][5];
}

 function result(){
 correct = 0;
      for (var i = 0; i < questions.length; i++) {
        if (questions[i][USER_CHOICE] == questions[i][Q_ANSWER]) correct++;
      }
    document.write("You got "+correct+"  correct of "+questions.length+" questions <br><br>");
   for(var z=0; z<=questions.length;z++){
 document.write("<img src="+questions[z][8]+" alt=''style=' max-width:100 '>");
 document.write ("<h3>Question: "+questions[z][0]+"</h3><br>");
 document.write ("A: "+questions[z][1]+"<br>");
 document.write ("B: "+questions[z][2]+"<br>");
 document.write ("C: "+questions[z][3]+"<br>");
 document.write ("D: "+questions[z][4]+"<br>");
 document.write ("E: "+questions[z][5]+"<br>");
 document.write ("Correct Ans: "+questions[z][6]+"<br>");
 document.write ("Your Ans: "+questions[z][7]+"<br><br>");
    }
}



function next() {

  var choices = document.getElementsByName("choices");
  for (var i = 0; i < choices.length; i++) {
    if (choices[i].checked) {
      choice = choices[i].value;
    }
  }

  questions[pos][7] = choice;



  updateAnswerHinting(); // Do your answer hinting (history) in this next function

  // Get rid of incrementing correct because if a user revisits an answer and 
  // chooses save then it will get incremented again if were correct


  if (pos + 1 >= questions.length) {
    var r = confirm("Submit test?", );
    if (r == true) {

      // Calculate correct since we are no longer tallying it as we go
      

      result();
      correct = "0";
      pos = "0";

    } else {

    }




    return false;

  } else {
    pos++;
    //console.log(pos, questions.length);
    qus();
    check();
  }


}


function uncheck() {
  // You can use a loop for this. Consider using this technique for other parts of your code

  for (var i = 0; i < 5; i++) {
    document.getElementById("r" + (i + 1)).checked = false;
  }

}

function check() {
  if (questions[pos][7] == "A") {
    document.getElementById("r1").checked = true;
  } else if (questions[pos][7] == "B") {
    document.getElementById("r2").checked = true;
  } else if (questions[pos][7] == "C") {
    document.getElementById("r3").checked = true;
  } else if (questions[pos][7] == "D") {
    document.getElementById("r4").checked = true;
  } else if (questions[pos][7] == "E") {
    document.getElementById("r5").checked = true;
  } else {
    uncheck();
  }
}



function w3_open() {
  document.getElementById("mySidebar").style.display = "block";
}

function w3_close() {
  document.getElementById("mySidebar").style.display = "none";
}

function qx(p) {
  // p is Base 1 (starts from 1)
  pos = p - 1;
  qus();
  check();
}




/// CODE TO CHANGE COLOR
const USER_CHOICE = 7;
const Q_ANSWER = 6;

function updateAnswerHinting() {
  possibleAnswers = ["A", "B", "C", "D", "E"];

  for (var i = 0; i < questions.length; i++) {
    var color = "white";
    if (possibleAnswers.includes(questions[i][USER_CHOICE])) {
      color = "green";
    } else if (questions[i][USER_CHOICE] != "not") {
      color = "red";
    }

    // To prevent future logical errors, check if element exists
    var el = document.getElementById("q" + (i + 1));

    if (el) el.style = "background-color:" + color;
  }
}

/// timer 

//show time 
let time = 120; // in seconds
var cde = document.getElementById("cd");

var x = setInterval(update, 1000);

function update() {
  var min = Math.floor(time / 60);
  var sec = time % 60;

  sec = sec < 10 ? '0' + sec : sec;
  cde.innerHTML = min + ":" + sec;
  time--;
  if (time < 00) {
    clearInterval(x);
  }
}
//end timer

setTimeout(function(){ alert("time up!");result();}, 120200);// milli sec

<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

<button class="w3-button w3-light-grey w3-large w3-right" onclick="w3_open() "><i class="fa fa-bars"></i></button>

<div id="cd" class="center large"></div>

<div class="w3-sidebar w3-bar-block w3-border-left top" style="display:none; width:15%; right:0;" id="mySidebar">
  <button onclick="w3_close()" class="w3-bar-item large">Close &times;</button>
  <a href="#" onclick="qx(1)"class="w3-bar-item w3-button w3-border " id="q1"> 1</a>
  <a href="#" onclick="qx(2)"class="w3-bar-item w3-button w3-border" id="q2"> 2</a>
  <a href="#" onclick="qx(3)"class="w3-bar-item w3-button w3-border" id="q3"> 3 &#10071;</a>
  <a href="#" onclick="qx(4)"class="w3-bar-item w3-button w3-border" id="q4"> 4</a>
  </div>




<label class="xxlarge" id="question">
    
</label><br><br> 


<input type="radio" name="choices" value="A"  id="r1"class="radio"><label id="c1"></label><br><br>
<input type="radio" name="choices" value="B"  id="r2"class="radio"><label id="c2"></label> <br><br>
<input type="radio" name="choices" value="C"  id="r3"class="radio"><label id="c3"></label><br><br>
<input type="radio" name="choices" value="D"  id="r4"class="radio"><label id="c4"></label><br><br>
<input type="radio" name="choices" value="E"  id="r5"class="radio"><label id="c5"></label>
  
  <br>
  <br>
  <br>
 
<button onclick="next()" class="btn green round" >Save & Next</button> 

<input type="checkbox" class="w3-check">mark for review