Still having problems with tic tac toe project

Hello All, here is my current code for my tic tac toe game. I have only enabled the first few squares as buttons, as I am taking it bit by bit, however I was confused as to why the computer makes a move for the first two player moves, but after than does not. I have been staring at my code for hours trying a bunch of different things but have not found success yet. Good luck :

<!-- Reference the plugins -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://use.fontawesome.com/6a26d6855f.js"></script>
<link href="/hover/css/hover.css" />
<link href="/hover/css/hover-min.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://fonts.googleapis.com/css?family=Roboto+Condensed" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Bungee+Shade" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Pacifico" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Press+Start+2P" rel="stylesheet">
<link href="https://fonts.googleapis.com/css?family=Oswald:700" rel="stylesheet">
<!-- Reference above this line -->





<script>
$(document).ready(function () {
  var player = "X";
  var computer = "O";
$('.exes').click(function () {
  player = "X";
  computer = "O";
  console.log(player, computer);
  $('.exes').attr('class', 'colored');
  $('.os').removeAttr('class', 'colored');
});
$('.os').click(function () {
  player = "O";
  computer = "X";
    console.log(player, computer);
  $('.os').attr('class', 'colored');
  $('.exes').removeAttr('class', 'colored');
});

var winCombos = [
  [0, 1, 2],
  [3, 4, 5],
  [6, 7, 8],
  [0, 4, 8],
  [1, 4, 7],
  [2, 5, 8],
  [0, 4, 8],
  [6, 4, 2]
];
var playerArray = [];
var computerArray = [];
var choices = [".one",".two",".three", ".four", ".five", ".six", ".seven", ".eight", ".nine"];
var response = function() {return Math.floor(Math.random() * 8);};
var tmp = response();
//Check Number Function so that Points Don't overlap
  function check() {
  for (var i = 0; i<playerArray.length; i++) {
    for(var j = i+1; j<computerArray.length; j++) {
    if (tmp === playerArray[i] || tmp === computerArray[j]) {
      tmp=response();
      console.log(tmp);
      check();
    } else {
      return;
    }
  }
  }
  }
  //--------------------------------
$('.start').click(selections());

function selections () {
  $('.one').click(function () {
    playerArray.push(0);
    $('.one').text(player);
    check();
    $(choices[tmp]).text(computer);
    $(choices[tmp]).attr('class', 'coloredWhite');
    computerArray.push(tmp);
    console.log(computer);
    selections();
  });
  $('.two').click(function () {
    playerArray.push(1);
    $('.two').text(player);
    check();
    $(choices[tmp]).text(computer);
    $(choices[tmp]).attr('class', 'coloredWhite');
    computerArray.push(tmp);
    console.log(computer);
    selections();
  });
  $('.three').click(function () {
    playerArray.push(2);
    $('.three').text(player);
    check();
    $(choices[tmp]).text(computer);
    $(choices[tmp]).attr('class', 'coloredWhite');
    computerArray.push(tmp);
    console.log(computer);
    selections();
  });
  $('.four').click(function () {
    playerArray.push(3);
    $('.four').text(player);
    check();
    $(choices[tmp]).text(computer);
    $(choices[tmp]).attr('class', 'coloredWhite');
    computerArray.push(tmp);
    console.log(computer);
    selections();
  });
  $('.five').click(function () {
    playerArray.push(4);
    $('.five').text(player);
    check();
    $(choices[tmp]).text(computer);
    $(choices[tmp]).attr('class', 'coloredWhite');
    computerArray.push(tmp);
    console.log(computer);
    selections();
  });
  $('.six').click(function () {
    playerArray.push(5);
    $('.six').text(player);
    check();
    $(choices[tmp]).text(computer);
    $(choices[tmp]).attr('class', 'coloredWhite');
    computerArray.push(tmp);
    console.log(computer);
    selections();
  });
}




});

</script>



<style>
body {
  background-color: rgb(56, 56, 56);
  height: 2000px;
}

.game {

  padding-top: 30px;
  height: 1075px;
  width: 1015px;
}

.selections {
  height: 300px;
  width: 300px;
  margin-left: 20px;
  margin-top: 20px;
  background-color: rgb(120, 255, 0);
  font-size: 200px;
  font-family: "Press Start 2P";
  text-align: center;
  padding-left: 45px;
  padding-top: 15px;
  color:rgb(56, 56, 56);

}
h2 {
  font-family: "Pacifico";
  font-size: 50px;
  color: rgb(255, 255, 255);
  text-align: center;
}
h3 {
  overflow: auto;
}
.letterSelection {
  text-align: center;
  font-family: "Press Start 2P";
  color: white;
  font-size: 100px;
}
a, a:hover, a:focus {
  color: inherit;
  text-decoration: none;
}
a.exes:hover, a.os:hover {
  color: rgb(120, 255, 0);
}
h4 {
  text-align: center;
  color: white
}
button {
  border-radius: 4px;
  background-color: rgb(120, 255, 0);
  border-color: inherit;
  border-style: solid;
  height: 100px;
  width: 300px;
  text-align: center;
  margin-left: 340px;
}
.colored {
  color: rgb(120, 255, 0);
}
.coloredWhite {
  color: white;
}
</style>




<html>



<div class="container game">
<h2>Player v.s CPU Tic-Tac-Toe</h2>
<h4>Slect Which Letter You Prefer</h4>
<div class="letterSelection">
  <a class="exes col-xs-6">X</a><a class="os col-xs-6">O</a>
</div>
<div class="mainGame">
<button class="start text-center" type="submit">Start Game</button>
<div class = "buttons">
<div class="selections col-md-4"><a href=" " onclick="return false" class="one">&nbsp;</a></div>
<div class="selections col-md-4"><a href ='' onclick="return false" class="two"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="three"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="four"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="five"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="six"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="seven"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="eight"> &nbsp;</a></div>
<div class="selections col-md-4"><a href ="" onclick="return false" class="nine"> &nbsp;</a></div>
</div>
</div>
</div>


</html>

As no one has responded yet I have decided to reply … first off it would be of more help if you could post a link to your game rather than just the code … FCC recently added the ability to run your code in the browser using repl.it … so if i was you i would copy the code to repl and post link.

Staring at your code for hours trying different things isnt the right approach …

Did you debug your code … what is it doing …

If you havent debugged your code why not

if you are not confident yet at using the debugger in chrome or another debugger … post a repl and i will have a look
debugging your code will show you whats going on compared to what you expect to be going on

Before I explain what I believe the problem is, I would like to point out that you have a duplicate win scenario, and are missing a vertical win case. Probably not good when you get to that point.

The reason you are having such a hard time tracking down your bug is because you are repeating code, rather than abstracting each piece out. If each function does one thing, and you’re having a problem, you can generally narrow the problem down to one or two specific functions.

I believe a problem is that you are reusing tmp variable without setting it to a new call to your random number function. You should call it before checking against what’s on the board.

Also, your inner for loop is doing something weird. Why are you only checking against some of the computer’s past moves? And for that matter, why is it nested anyway? You don’t need to check each player move against each computer move and also against the current computer move. You just need to check that the space is not in either array.

Hope that helps you look at it a little differently, since that’s usually what helps.