title: Javascript Tic Tac Toe - Winning function not invoking/working
body: <p>I am trying to build a simple tic tac toe game with two players, I have a isWinner() function to check for a winner(just the first row atm to test) but the function doesn't seem to get invoked even though i have called it. I want the function to alert 'winner' once a user gets three in a row in the first row.</p>
  
  <p>My code:</p>
  
  <p>HTML</p>
  
  <pre><code> &lt;div class="container-fluid"&gt;
    &lt;div class="wrapper"&gt;
      &lt;div col-xs-12&gt;
        &lt;div id="dialogOverlay"&gt;&lt;/div&gt;
        &lt;div id="dialogBox"&gt;
          &lt;div id="dialogHead"&gt;&lt;/div&gt;
          &lt;div id="dialogMain"&gt;X or O?&lt;/div&gt;
          &lt;div id="dialogFooter"&gt;
            &lt;button class="btn btn-default" id="cross"&gt;X&lt;/button&gt;
            &lt;button class="btn btn-default" id="circle"&gt;O&lt;/button&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
  &lt;div class="col-xs-4" div id="top-left"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="top"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="top-right"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="left"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="middle"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="right"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="bottom-left"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="bottom"&gt;&lt;/div&gt;
  &lt;div class="col-xs-4" div id="bottom-right"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>
  </p>
  
  <pre><code>JS:
  
      $(document).ready(function() {
    var x = "X";
    var o = "O";
    var userChoice;
    var dialogBox = $("#dialogBox");
    var s1 = $("#top-left").text();
    var s2 = $("#top").text();
    var s3 = $("#top-right").text();
    var s4 = $("#left").text();
    var s5 = $("#middle").text();
    var s6 = $("#right").text();
    var s7 = $("#bottom-left").text();
    var s8 = $("#bottom").text();
    var s9 = $("#bottom-right").text();
  
    var countMoves = 0;
  
    renderDialog();
    dialogChoice(); // user chooses X or O
    move();
    isWinner();
  
    function renderDialog() {
      var winW = window.innerWidth;
      var centerDialog = (winW / 2) - (600 * 0.5); // to center
      dialogBox.css("display", "block")
      dialogBox.css("left", centerDialog + "px");
      dialogBox.css("top", "100px")
    }
  
    function dialogChoice() {
      var cross = $('#cross');
      var circle = $('#circle');
  
      cross.on("click", function() {
        dialogBox.css("display", "none");
        userChoice = "X";
  
      });
      circle.on("click", function() {
        dialogBox.css("display", "none");
        userChoice = "O";
      });
    }
  
    function move() {
  
      $("#top-left").on("click", function() {
        if ($("#top-left").html() === '') {
          $("#top-left").text(userChoice);
          userTurn();
        };
      });
      $("#top").on("click", function() {
        if ($("#top").html() === '') {
          $("#top").text(userChoice);
          userTurn();
        };
  
      });
      $("#top-right").on("click", function() {
        if ($("#top-right").html() === '') {
          $("#top-right").text(userChoice);
          userTurn();
        }
  
      });
      $("#left").on("click", function() {
        if ($("#left").html() === '') {
          $("#left").text(userChoice);
          userTurn();
        };
      });
      $("#middle").on("click", function() {
        if ($("#middle").html() === '') {
          $("#middle").text(userChoice);
          userTurn();
        };
      });
      $("#right").on("click", function() {
        if ($("#right").html() === '') {
          $("#right").text(userChoice);
          userTurn();
        };
      });
      $("#bottom-left").on("click", function() {
        if ($("#bottom-left").html() === '') {
          $("#bottom-left").text(userChoice);
          userTurn();
        };
      });
      $("#bottom").on("click", function() {
        if ($("#bottom").html() === '') {
          $("#bottom").text(userChoice);
          userTurn();
        };
      });
      $("#bottom-right").on("click", function() {
        if ($("#bottom-right").html() === '') {
  
          $("#bottom-right").text(userChoice);
          userTurn();
        };
      });
  
    };
  
    function userTurn() {
  
      if (userChoice === "X") {
        userChoice = "O";
      } else {
        userChoice = "X";
      }
  
    };
  
    function isWinner() {
      var result = false;
      if (s1 == "X" &amp;&amp; s2 == "X" &amp;&amp; s3 == "X" || s1 == "O" &amp;&amp; s2 == "O" &amp;&amp; s3 == "O") {
        alert("winner")
        result = true
      }
  
      return result;
    };
  
  });
  </code></pre>
  
  <p>example: <a href="http://codepen.io/aliz16/pen/yJgQQd" rel="nofollow">http://codepen.io/aliz16/pen/yJgQQd</a></p>