unable to trigger event delegation

Question

hi i am unable to trigger simple event delegation on my code, The dom elments within selected DIV are dynamically created.

<div class="holder" style="-moz-user-select: none;">
  <a class="jp-previous page1"> previous</a>
  <a class="page">1</a>
  <span class="jp-hidden">...</span>
  <a class="page jp-current">2</a>
  <a class="jp-next page1 jp-disabled">next </a>
</div>

Following is my JS Code which i am executing within ready block.

jQuery("div[class=holder]").on('click',function() {
        alert('i am here');
    });

your syntax is wrong `jQuery(document).on('click', "div[class=holder]", function() {..});` - also use a class selector instead of attribute selector so `jQuery(document).on('click', ".holder", function() {..});` — Arun P Johny, Jun 16 '14 at 11:01
then try using a class selector as I said the updated comment — Arun P Johny, Jun 16 '14 at 11:03

K.K.Agarwal · Accepted Answer · 2014-06-16T11:08:13.020

1

try this....

jQuery(document).on('click','div[class=holder]',function() {
        alert('i am here');
    });

Can also use

 jQuery(document).on('click','.holder',function() {
            alert('i am here');
        });

edited Jun 16 '14 at 11:08

answered Jun 16 '14 at 11:02

K.K.Agarwal

836
5
10

`jQuery("document")`.....really???? – Jai Jun 16 '14 at 11:06

score 1 · Answer 2 · answered Jun 16 '14 at 11:02

1

Try,

jQuery(document).on('click',".holder",function() {

answered Jun 16 '14 at 11:02

Rajaprabhu Aravindasamy

63,064
13
90
119

unable to trigger event delegation

2 Answers2