jQuery each and attaching click event

Question

I am not a programer but I enjoy building prototypes  All of my experience comes from actionScript2   Here is my question  To simplify my code I would like to figure out how to attach   click  events to div s that are already existing in the HTML body    lt body gt   lt div id  dog-selected  gt dog lt  div gt   lt div id  cat-selected  gt cat lt  div gt   lt div id  mouse-selected  gt mouse lt  div gt    lt div class  dog  gt  lt img gt  lt  div gt   lt div class  cat  gt  lt img gt  lt  div gt   lt div class  mouse  gt  lt img gt  lt  div gt   lt  body gt    My  failed  strategy was  1  make an array of objects   var props      dog    false    cat    true    mouse    false         2  iterate through the array with   each  and augment each existing div with a   click  event  Lastly  construct a local variable    here is a prototype     each props  function key  value              key  -selected   click function    var key   value

User · Accepted Answer

One solution you could use is to assign a more generalized class to any div you want the click event handler bound to.

For example:

HTML:

<body>
<div id="dog" class="selected" data-selected="false">dog</div>
<div id="cat" class="selected" data-selected="true">cat</div>
<div id="mouse" class="selected" data-selected="false">mouse</div>

<div class="dog"><img/></div>
<div class="cat"><img/></div>
<div class="mouse"><img/></div>
</body>

JS:

$( ".selected" ).each(function(index) {
    $(this).on("click", function(){
        // For the boolean value
        var boolKey = $(this).data('selected');
        // For the mammal value
        var mammalKey = $(this).attr('id'); 
    });
});

User · Answer

No need to use  each  click already binds to all div occurrences      div   click function e                     See Demo  Note  use hard binding such as  click to make sure dynamically loaded elements don t get bound

[jquery] jQuery '.each' and attaching '.click' event

Examples related to jquery

Examples related to each