jquery не распознает новый класс после .removeClass(). AddClass()?

Question

Возможно, я делаю это неправильно/нерационально, но это не работает для меня:

$(document).ready(function(){ 

    $('li.taglink').click(function(){ 
     alert('clicked tag'); 
     $userClicked = $(this).html(); 
     $('#holder').children('div').each(function() { 
      $('li.taglinkcurrent').removeClass('taglinkcurrent').addClass('taglink');          
      $x = $(this).attr("tags"); 
      ele = $x.split(','); 
      for (var i = 0; i < ele.length; i++) 
      { 
      if ($userClicked == ele[i]) {$(this).show(495); break;} 
            else {$(this).hide(495);} 
      } 
     }); 
     $(this).removeClass('taglink').addClass('taglinkcurrent'); 
    }); 

    $('li.taglinkcurrent').click(function(){ 
     alert('clicked current'); 
     $('li.taglinkcurrent').removeClass('taglinkcurrent').addClass('taglink');        
     $('li.taglink').show(495); 
    }); 

}); 

страница содержит дивы с «метки» атрибутов, который содержит несколько тегов. У меня также есть неупорядоченный список, каждый элемент которого содержит отдельные теги. Когда пользователь нажимает один из элементов li, он показывает все div, которые имеют этот тег, и скрывает все остальное. Если пользователь нажимает на тот же элемент li, он снова показывает все. Я добавил в предупреждениях, чтобы проверить, что происходит, и каждый раз, когда я нажимаю ссылку, она выталкивает «щелкнув ссылку», даже когда у ли ее класс переключился на .taglinkcurrent. Любые идеи о том, что я сделал неправильно?

Answer 1

Я полагаю, что событие связано с каждой литой нагрузкой, а последующие изменения классов не отделяют событие. Но вы можете легко исправить это таким образом, я думаю:

$('li').click(function() { 
    if ($(this).hasClass("taglink")) { 
     alert("clicked tag"); 
     ... 
    } else if ($(this).hasClass("taglinkcurrent")) { 
     alert('clicked current'); 
     ... 
    } 
}); 

Answer 2

Вы связываетесь с событием click() при первом запуске кода, поэтому класс "taglink" является единственным в игре.

Чтобы иметь изменение функции в зависимости от изменений в йот использовать on() метод вместо:

http://api.jquery.com/on/

$(document).on("click", "li.taglink", function() { 
    // ... 
}); 

Есть много предостережений о с методом on() однако - смотрите документацию выше более подробно.

Редактировать: Изменено 'live' to 'on', как из v1.7, что является предпочтительным методом.