Inner HTML not working in this case with a tic-tac-toe ai

Look, I have this for a tic-tac-toe ai:

function checkForThreats() {
  for (let i = 0; i <= 7; i++) {
    var cell = winningConditions[i].indexOf("");
      let index = gameState[cell];
      document.querySelector(`[data-cell-index="${index}"]`).innerHTML = "O";
  }
}

and it gives me an error that I can’t set properties of null, I’m confused on how this would work.

I tried to change and mess with the string interpolation yet it still gave errors.