Разбираюсь с Jquery, почему не работает метод $("#id")?

Question

[User .]

Добрый день,
пробую написать обработчик событий для проверки результата игры в крестики нолики, не могу понять почему не могу использовать данный код:

//jQuery("#player-2");
//$("#player-2");

Выдает ошибку(в html файле Jquery подключен):

listeners.js:26 Uncaught ReferenceError: jQuery is not defined
at HTMLDivElement.<anonymous> (listeners.js:26)

script.js

var $counter=1;
var $gamer_circle=0;
var $gamer2_cross=0;
var $buff=0;
var $res= ["2","2","2","2","2","2","2","2","2"];
 
 
$squares.forEach(function ($square, index) {
    $square.addEventListener('click', function () {
        var $innerSquare = $square.querySelector('span.inner-square');
 
            if ($counter && $innerSquare.className == 'inner-square') {
                $innerSquare.classList.add('inner-square-circle');
                $counter = 0;
                $gamer_circle++;
                document.getElementById('tour').innerHTML = "Tour de "+document.getElementById("player-2").value;
                ScoreCheck();
            }
                    else {
                        if ($innerSquare.className == 'inner-square') {
                            $innerSquare.classList.add('inner-square-cross');
                            $counter = 1;
                            $gamer2_cross++;
                            document.getElementById('tour').innerHTML = "Tour de "+document.getElementById("player-1").value;
 
 
                            //$var a = jQuery("#player-2").text();
                            //$var b = $("#player-2").html();
                            
 
                            ScoreCheck();
                        }
                    }
 
                  function ScoreCheck() {
                      for (i = 0; i < document.getElementsByClassName('inner-square').length; i++) {
                           if(document.getElementsByClassName('inner-square')[i].className == 'inner-square inner-square-circle'){
                               $res[i]='0';
                           }
                          if(document.getElementsByClassName('inner-square')[i].className == 'inner-square inner-square-cross'){
                              $res[i]='1';
                          }
 
 
 
                      }
                        //+res[0]+res[1]+res[2]+res[3]+res[4]+res[5]+res[6]+res[7]+res[8]
                        //$buff = res.toString();
                        //$buff = res.join("").toString();
 
                         console.log($res);
                        //console.log(res[0]+res[1]+res[2]);
 
                      if( ($res[0] == '0' && $res[1] == '0' && $res[2] == '0') ||
                          ($res[3] == '0' && $res[4] == '0' && $res[5] == '0') ||
                          ($res[6] == '0' && $res[7] == '0' && $res[8] == '0') ||
                          ($res[0] == '0' && $res[3] == '0' && $res[6] == '0') ||
                          ($res[1] == '0' && $res[4] == '0' && $res[7] == '0') ||
                          ($res[2] == '0' && $res[5] == '0' && $res[8] == '0') ||
                          ($res[0] == '0' && $res[4] == '0' && $res[8] == '0') ||
                          ($res[2] == '0' && $res[4] == '0' && $res[6] == '0')) {
                          console.log("Gamer circle WIN");
                          document.getElementById('tour').innerHTML = document.getElementById("player-1").value+ " a gagnГ©!";
                      }
 
                      if( ($res[0] == '1' && $res[1] == '1' && $res[2] == '1') ||
                          ($res[3] == '1' && $res[4] == '1' && $res[5] == '1') ||
                          ($res[6] == '1' && $res[7] == '1' && $res[8] == '1') ||
                          ($res[0] == '1' && $res[3] == '1' && $res[6] == '1') ||
                          ($res[1] == '1' && $res[4] == '1' && $res[7] == '1') ||
                          ($res[2] == '1' && $res[5] == '1' && $res[8] == '1') ||
                          ($res[0] == '1' && $res[4] == '1' && $res[8] == '1') ||
                          ($res[2] == '1' && $res[4] == '1' && $res[6] == '1')) {
                          console.log("Gamer cross WIN");
                          document.getElementById('tour').innerHTML = document.getElementById("player-2").value+ " a gagnГ©!";
                          }
 
                    }
 
    });
});

ps: если требуется скину все в архиве.

Answer 1

[Владимир Проскурин]

Ну вы хоть прочитайте ошибку
listeners.js:26 Uncaught ReferenceError: jQuery is not defined
Что в переводе - jQuery не определен, т.е. его не существует. А значит, что либо вы его не подключили, либо вы подключили его после вашего скрипта.

Comments

[Beliyadm]

Либо он подключен в режиме noconflict и в скрипте к жквери обращаются через объект $ либо наоборот, нонконфликт не подключен но обращаются будто подключен через jQuery
Потому на всякий случай лучше оборачивать пользовательский JS в обертку:

(function( $ ){
   // мой код тут
})( jQuery );