タイピングゲームでたとえばappleの問題を解いている間にりんごの画像を表示させる方法を調べているのですがうまくいきません。

きちんとリストの同じインデックス同士で合わせるにはどうしたらよいのでしょうか？

リストは

const words = [
    'apple',
    'sky',
    'blue',
    'middle',
    'set',
  ];

  const imgs = [
    'img/pic00.png',
    'img/pic01.png',
    'img/pic02.png',
    'img/pic03.png',
    'img/pic04.png'
  ];

そして

const targetImg = document.getElementById('image');
  targetImg.src = imgs[Math.floor(Math.random() * words.length)];

として

window.addEventListener('keydown', e => {
    if (isPlaying !== true) {
      return;
    }
    if (e.key === word[loc]) {
      loc++;
      if (loc === word.length) {

        word = words[Math.floor(Math.random() * words.length)];
        targetImg.src = imgs[Math.floor(Math.random() * words.length)];
        loc = 0;
      }

としました。いろいろやってみましたがわかりませんでした。どうかよろしくお願いします。