title: Why can't I apply my JS event to my EJS code?
body: <p>I would like to apply a click event to the image in my EJS file, here is the ejs code:</p>
  
  <pre><code>&lt;div class="container" id="comments"&gt;
      &lt;div class="row"&gt;
          &lt;div class="col-lg-12"&gt;
              &lt;div class="well"&gt;
                  &lt;div id="scrollit"&gt;
                      &lt;% greword.Comments.forEach(function(comment){ %&gt;
                      &lt;strong&gt;&lt;p id="author"&gt;&lt;%= comment.author %&gt;&lt;/p&gt;&lt;/strong&gt;
                      &lt;i id="likesi" class="far fa-thumbs-up"&gt;&lt;/i&gt;&lt;span id="likes"&gt;&lt;%= comment.likes %&gt;&lt;/span&gt;
                      &lt;i id="dislikesi" class="far fa-thumbs-down"&gt;&lt;/i&gt;&lt;span id="dislikes"&gt;&lt;%= comment.dislikes %&gt;&lt;/span&gt;
                      &lt;span class="pull-right"&gt;10 days ago&lt;/span&gt;
                      &lt;p&gt;
                          &lt;%= comment.text %&gt;
                      &lt;/p&gt;
                      &lt;% }) %&gt;
  </code></pre>
  
  <p>Here is my JS code:</p>
  
  <pre><code>$("#comments .row .col-lg-12 .well #scrollit").on("click", "#dislikesi", function(){
  
  console.log("OK");
  
  });
  </code></pre>
  
  <p>I have checked that my ejs file has been linked to JS file successfully. But strangely, it doesn't work. I can not figure it out, can somebody help me? Thanks a lot!</p>
  
  <p>//*********************************************** Update!!! ***********************************************//</p>
  
  <p>I have realized that I misused IDs, because the forEach function will generate multiple IDs. So I changed my codes. Here is my new ejs codes of that forEach function:</p>
  
  <pre><code>&lt;% greword.Comments.forEach(function(comment, index){ %&gt;
                      &lt;strong&gt;&lt;p id="author"&gt;&lt;%= comment.author %&gt;&lt;/p&gt;&lt;/strong&gt;
                      &lt;i class="far fa-thumbs-up"&gt;&lt;/i&gt;&lt;span class="likes"&gt;&lt;%= comment.likes %&gt;&lt;/span&gt;
                      &lt;i class="far fa-thumbs-down &lt;%= index %&gt;"&gt;&lt;/i&gt;&lt;span class="dislikes"&gt;&lt;%= comment.dislikes%&gt;&lt;/span&gt;
                      &lt;%= index %&gt;
                      &lt;span class="pull-right"&gt;10 days ago&lt;/span&gt;
                      &lt;p&gt;
                          &lt;%= comment.text %&gt;
                      &lt;/p&gt;
                      &lt;% }) %&gt;
  </code></pre>
  
  <p>And I use this as JS codes:</p>
  
  <pre><code>$("#comments #scrollit").on("click", ".2", function(){
  
  console.log("OK");
  
  });
  </code></pre>
  
  <p>in order to click the 3rd comment's dislikes image. But it still doesn't work.</p>
  
  <p>//*********************************************** Update!!! ***********************************************//</p>
  
  <p>Thanks so much to "LGSon", my codes finally work properly.</p>