Tic tac toe challenge help

Hi I 've almost completed this challenge but I’m stuck on two small things. It would be greatly appreciated if anyone could take a look at my codepen to help me resolve them.

first issue: Is to give the user the option to select either X or O to play with. I’ve tried different ways and from what I see my code should work please kindly take a look. I’m still beginner level with jquery and am trying to use it to solve this. Here is how looks below:

// Global Variables
var origBoard;
const huPlayer = " ";
const aiPlayer = " ";
// array of winning combos on the board
const winCombos = [
 [0, 1, 2],
 [3, 4, 5],
 [6, 7, 8],
 [0, 3, 6],
 [1, 4, 7],
 [2, 5, 8],
 [0, 4, 8],
 [6, 4, 2]

const cells = document.querySelectorAll(".cell");

$("#x").on("click", function() {
    const huPlayer = "X";
    const aiPlayer = "O";
   $("#o").on("click", function() {
    const huPlayer = "O";
    const aiPlayer = "X";



second issue: After tinkering around with my code trying to solve the first issue, I stopped and decided to just revert everything to how it was and have it so that huPlayer = X and aiPlayer= O. But they are not appearing on the table any longer. I’ve looked at every line of html css and js to see whats the issue and I can’t figure it out. this is my codepen without trying to allow user to select an x or o. There’s a lot of comments in the js but its mostly notes for myself for understanding and learning – will clean it up before final submission)

Thank you for your time in helping me!

I got it all to work! :smiley:
Thanks anyways.

at first I think I was really just rushing it and letting my frusturation get the best of be. But after a good break, and coming back to it I got it all to work.

As tends to be the case, I was just missing small things that stopped everything from working like:
the $ before (document).ready(function () {

Thank you anyway!