Running jQuery code I can't figure out what's wrong?

Question

JavaScript

There is a button on which the jQuery code should be called.

<button  id="test" type="button" class=" btn btn-default  navbar-btn" data-target="#test" data-toggle="modal"><a><i class="fa fa-hashtag" aria-hidden="true"></i> </a></button>

The jQuery code is here The jQuery code itself

<script src="test.js"></script>

var mytest ='

       <!-- HTML-код модального окна -->
<div class="modal fade"  tabindex="-1">
  <div class="modal-dialog modal-lg">
    <div class="modal-content">
      <!-- Заголовок модального окна -->
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
        <h4 class="modal-title">Тестирование</h4>
      </div>
      <!-- Основное содержимое модального окна -->
      <div class="modal-body">
         <p>спасибо скрипту тест пройден.</p>
      </div>
      
    
  </div>
</div>
    </div>  


';

$('#test').on('click', mytest);

I can not understand how jQuery understands which selector it should react to.?
I mean, the button must have an id for the script to work? Or like I have a modal window?
Thanks in advance.

Answer 1

$('#test').on('click', mytest);
$('#test') Указывает на какой элемент реагировать
click на какое действие реагировать
mytest указывает какую функцию выполнить.