javascript - Jquery Event Handler ".on()" -

i have problem jquery event handler ".on()".

i have button favorite on post on home page.

if haven't favorited post:

• li not active
• event 1

if have favorited post:

• li active
• event 2

why when click multiple times (>1) on button, script same method (event) whereas have class .active on li or not?

it's .on() doesn't manage dynamic class change...

my html:

<ul class="post-list">     <li>         <a href="#" class="favorite">favorite</a>     </li>     <li class="active">         <a href="#" class="favorite">favorite</a>     </li> </ul> 

my jquery:

$(function(){     $('.post-list li.active .favorite').on('click', function(e){         e.preventdefault;         // event 2     });     $('.post-list li:not(.active) .favorite').bind('click', function(e){         e.preventdefault;         // event 1     }); }); 

jquery binds events result of selectors (once). hoping selector re-computed each time event fires, @ point handlers have been bound whichever elements matched selector originally.

try:

$(function(){     $('.post-list li .favorite').on('click', function(e){         e.preventdefault();         if (e.target.hasclass('active') {            //event 2         }         else {            //event 1         }     }); });