スマホ時のみテーブルにデータ追加できない

Question

colAdd関数を呼ぶとテーブルが空の場合、パソコンでは行の追加ができるのですが、スマホで見ると追加できません。

1行でもtrデータが入っていると問題なく追加できます。

ラベルの値を変えたりはできてるので処理は走っておりました。

この理由がよくわかっておらず可能なら修正したいです。
スマホではSafariとChromeで検証しました。

<table id="table" class="table">
  <thead>
    <tr>
      <th scope="col" class="col-1">1</th>
      <th scope="col" class="col-2">2</th>
      <th scope="col" class="col-2">3</th>
    </tr>
  </thead>
  <tbody>
	<!-- ここが空の場合 -->
  </tbody>
</table>

<script>
// これを呼び出してもからの場合はデータ追加できない (スマフォのみ)
function colAdd() {
  var table = document.getElementById("table");
// 行を行末に追加
  var row = table.insertRow(-1);

  //td分追加
  var cell1 = row.insertCell(-1);
  var cell2 = row.insertCell(-1);
  var cell3 = row.insertCell(-1);

  cell1.innerHTML = "aaa1";
  cell2.innerHTML = "aaa2";
  cell3.innerHTML = "aaa3";
}
</script>

Answer 1

  cell3.innerHTML = "aaa3";
</script>
}

</script>は}の後じゃないでしょうか？

  cell3.innerHTML = "aaa3";
}
</script>

Comments

[momiji0210]

失礼しました！コードの記載ミスです。
実際はご指摘いただいたようになっております。
修正いたします。

[babu_babu_baboo]

table.tBodies[0].insertRow ()

[momiji0210]

ありがとうございます！こちらで記載したら問題なく動きました。
もし可能でしたらご教示いただきたいのですが、
table.insertRow(-1); と table.tBodies[0].insertRow ()
の違いってどういった点でしょうか。

PCでは動くのみスマホで動かないということは初めての事象でした。
なぜ、このような現象に陥るのか知っておきたいです。