jQuery не распознает: не (.className) фильтрация

Question

Когда я динамически добавляю класс к элементу, псевдофильтрация не распознает этот класс. Эта проблема возникает, когда я использую функцию on(), но все нормально, когда я использую live ()

http://jsfiddle.net/AHyyq/1/

В начале все элементы списка кликабельны. Но после нажатия кнопки "Ipsum" больше не должен нажимать на кнопку, и не должно появляться другое сообщение "Неактивно".

$('.item:not(.active)').on('click', function(){
   $('<p>Not active</p>').appendTo('body');
});

Answer 1

$('body').on('click', '.item:not(.active)', function(){
    $('<p>Not active</p>').appendTo('body');
});

Answer 2

Использование $(document).on

$(document).on('click','.item:not(.active)', function(){
   $('<p>Not active</p>').appendTo('body');
});

DEMO

Answer 3

Это правильное поведение. Вы добавляете события в неактивные элементы (все 3 элемента.). Таким образом, он не будет отменять привязку событий, если вы добавите класс.

Я бы сделал что-то вроде этого:

$('input[type=button]').click(function(){
    $('.item:nth-child(2)').addClass('active').css('color','#F00');
});

$('.item').on('click', function() {    
    if($(this).is('.active')) return;

    $('<p>Not active</p>').appendTo('body');
});

http://jsfiddle.net/AHyyq/9/

Answer 4

Посмотреть здесь

 $(document).on('click','.item:not(.active)', function(){
   $('<p>Not active</p>').appendTo('body');
});