javascriptで画像が表示できない基本的な問題をかかえています

前提

javascriptで神経衰弱の勉強をしていますが、準備した画像が表示されません。デベロッパーツールにエラーなし、同じく指しているpngは正常に取得できている様子。

実現したいこと

ここに実現したいことを箇条書きで書いてください。
画像表示をさせたい
理由が知りたい

発生している問題・エラーメッセージ

該当のソースコード

javascript
1
2
3  // 全てのカード情報を入れる配列
4  const cards = [];
5  
6  // カテゴリ
7  const suits = ["A","B","C","D",];
8
9  // オブジェクト作成
10  function Card(suit, num) {
11     this.suit = suit;
12     this.num = num;
13        this.front = `${this.suit}${('0'+this.num).slice(-2)}.png`;
14}
15
16  // カード情報を配列に格納
17  for (let i = 0; i < suits.length; i++) {
18    for (let j = 1; j <= 5; j++) {
19      let card = new Card(suits[i], j);
20      cards.push(card);
21      console.log(card)
22    }
23  }
24
25
26  const table = document.querySelector(".table");
27
28    // シャッフルする関数
29    function shuffle(arrays) {
30        const array = arrays.slice();
31        for (let i = array.length - 1; i >= 0; i--) {
32          const randomIndex = Math.floor(Math.random() * (i + 1));
33          [array[i], array[randomIndex]] = [array[randomIndex], array[i]];
34        }
35        return array;
36      }
37
38  function shuffleCard() {
39     const shuffled = shuffle(cards);
40     for (let i = 0; i < suits.length; i++) {
41       const tr = document.createElement("tr");
42       table.appendChild(tr);
43       for (let j = 0; j < 5; j++) {
44         const td = document.createElement("td");
45            td.style.backgroundImage = `url(img/${shuffled[i * 5 + j].front})`;
46         tr.appendChild(td);
47       }
48     }
49    }
50  shuffleCard();

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <meta http-equiv="X-UA-Compatible" content="IE=edge">
6    <meta name="viewport" content="width=device-width, initial-scale=1.0">
7    <script src="izumo.js" defer></script>
8    <title>チャレンジ</title>
9</head>
10<body>
11  <table class="table" border="1"></table>
12
13</body>
14</html>

試したこと

画像のリネーム等

よろしくお願いします。

行動規範の内容に同意します

回答2件

js
1         const td = document.createElement("td");
2            td.style.backgroundImage = `url(img/${shuffled[i * 5 + j].front})`;
3         tr.appendChild(td);