Javascriptでタイピングゲームを作りたい

##実現したいプログラム
イラスト付きのタイピングゲームを制作中です。
イラストをヒントに単語をタイプしていってもらうようなプログラムが作りたいです。

##エラー・問題点
イラストと該当の単語をそれぞれオブジェクトにして、配列としてまとめて、
shuffleでランダムに出題されるようにしています。
１問目は問題なく意図通りに動くのですが、
２問目に問題が切り替わるとkeydownが作動しなくなります。

##現状のコード

JS
'use strict';

{
  function setQuiz(){
    loc = 0;
    question.src = quizSet[currentNum].q;
    target.textContent = quizSet[currentNum].t;
    }

  const question = document.getElementById('js-image');
  const target = document.getElementById('js-target');
  const quizSet = shuffle([
    {q: '../img/＊＊＊1.png', t:'＊＊＊1'}, //q:pics, t:words
    {q: '../img/＊＊＊2.png', t:'＊＊＊2'},
    {q: '../img/＊＊＊3.png', t:'＊＊＊3'},
    {q: '../img/＊＊＊4.png', t:'＊＊＊4'},
    {q: '../img/＊＊＊5.png', t:'＊＊＊5'},
    {q: '../img/＊＊＊6.png', t:'＊＊＊6'},
  ]);

  let currentNum = 0;
  let loc = 0;
  let isPlaying = false;
  let word = quizSet[currentNum].t;

    function shuffle(arr) {
        for (let i = arr.length - 1; i > 0; i--) {
          const j = Math.floor(Math.random() * (i + 1));
          [arr[j], arr[i]] = [arr[i], arr[j]];
        }
        return arr;
      }

    document.addEventListener('click', ()=> {
    if (isPlaying === true){
      return;
    }

    isPlaying = true;
    setQuiz();
  });

   document.addEventListener('keydown', e => {
     if (e.key !== word[loc]) {
       return;
     }
     loc++;
     target.textContent = '_'.repeat(loc) + word.substring(loc);

     if (loc === word.length){
        currentNum++;
        setQuiz();
      }
   });
 }

HTML
<!DOCTYPE html>
<html lang="ja">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="description" content="Typing game">
    <title>Typing game</title>
    <link rel="stylesheet" href="css/ress.css">
    <link rel="stylesheet" href="css/style.css">
  </head>
  <body>
    <img id="js-image">
    <p id="js-target">Start!</p>
    <p id="js-result"></p>
    <footer class="l-footer">
      <div class="l-footer__inner">
        <p class="p-footer__copyright"><small>&copy; 2020 *** Allrights Reserved.</small></p>
      </div>
    </footer>
    <script src="js/main.js"></script>
  </body>
</html>

css
body {
  padding-top: 40px;
  font-family: 'Courier New', monospace;
  text-align: center;
}

body p {
  padding-bottom: 20px;
}

#js-target {
  font-size: 48px;
  letter-spacing: .1em;
}

##試したこと
quizSetのtのキーに格納されている単語を取り出して、keydownのイベントで
タイピングの正誤判定をすればいいと思うのですが、word[loc]の記述がおかしいのでは
ないかというところまでは目星を付けたのですが、どう書き換えれば作動するかが分かりません。
アドバイスいただけますと、非常に助かります。