Реагировать на классы, добавленные через JQuery

Question

У меня есть меню на моем веб-сайте, которое отображается и скрывается, когда пользователи нажимают на ссылку.

Как правило, я бы использовал переключатель для этого. Однако у меня есть другие меню на странице, поэтому их нужно закрыть, когда это отображается (я также применяю/удаляю классы анимации). Поэтому я считаю, что лучший способ сделать это - добавить к ссылке класс close, а затем отреагировать на этот добавленный класс (так как в других меню также есть класс close).

Однако Jquery, похоже, не реагирует на классы, добавленные через JQuery. Я искал для этого и нашел, что для этой цели вы можете использовать Live(). Но, live() теперь обесценивается, и вместо этого вы должны использовать On().

Способ использования На выглядит следующим образом:

$('.anchor').on('click', '.close', function()

Но это не похоже на работу. Я также пробовал варианты этого, но никто из них, похоже, не работает.

Как я могу заставить JQuery реагировать на добавленные классы.

JSFIDDLE Here

Answer 1

Bind кликах к документу и удалить класс .close на .anchor мыши и наоборот.

$(document).on('click','.anchor', function() { 
    $(this).removeClass('anchor'); 
    $(this).addClass('close'); 
    // ... 

и

$(document).on('click', '.close', function() { 
    $(this).removeClass('close'); 
    $(this).addClass('anchor'); 
    // ... 

Примечание: лучше обернуть HTML в некоторых DIV и привязки событий к тому, что Div вместо привязки его ко всему документу.

http://jsfiddle.net/Mq5xX/

Update

Или еще лучше изменить класс по тесной связи с .anchor и использовать этот код.

$(document).on('click','.anchor', function() { 
    $('.anchor').addClass('close'); 
    $('.anchor').removeClass('anchor'); 
    // ... 

и

$(document).on('click','.close', function() { 
    $('.close').addClass('anchor'); 
    $('.close').removeClass('close'); 
    // ... 

http://jsfiddle.net/Mq5xX/1/

Answer 2

Я думаю, ваша проблема в том, что ваш «закрыть» ссылка не содержится в элементе с классом «якоря». Поэтому jQuery ищет его, но не находит элемент и не может привязать событие click к нему.

Если вы используете $('.close').on('click', function() { ... });, он действительно работает.

Updated fiddle