title: JQuery Tic Tac Toe 2 Players
body: <p>would like to seek advices from you guys. I'm a beginner only. :( I'm trying to make a game, a 2 Player Tic Tac Toe though I'm not yet in the functionality part. What can you suggest here in implementing the game?</p>
  
  <p>What I am trying to do is that I want to disable the "div" once the player clicked it and I have no idea yet how to implement that using JQuery. TIA.</p>
  
  <p><strong>SCRIPT:</strong></p>
  
  <pre><code>$(document).ready(function() {         
              var player1 = true;
              var player2 = true;
              var O = "&lt;img id='o1' src='img/O.png' value='o'/&gt;";
              var X = "&lt;img id='x1' src='img/X.png' value='x'/&gt;";
  
              function resetP1() {
                  player1 = true;
              }
  
              function resetP2() {
                  player2 = true;
              }
  
              $(".box").click(function() {
                  //var value = $(this).attr('value');
                  //$(this).hide();
  
                  if(player1) {
                      $(this).html(X);
                      player1 = false;
                      resetP2();
                  } else {
                      $(this).html(O);
                      player2 = false;
                      resetP1();
                  }
  
              });
          });
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>        &lt;div id="b1" value="b1" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b2" value="b2" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b3" value="b3" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b4" value="b4" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b5" value="b5" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b6" value="b6" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b7" value="b7" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b8" value="b8" class="box"&gt;
  
          &lt;/div&gt;
          &lt;div id="b9" value="b9" class="box"&gt;
  
          &lt;/div&gt;
  </code></pre>