Скрыть динамически подсвеченный элемент с классом через jQuery

Question

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

Это кажется тривиальным и должно быть очень простым, но я не могу понять, почему мой код не работает. Другое дело, по какой-то причине, ссылки по-прежнему проходят после щелчка в скрипке. Не уверен, что это что-то с jsfiddle и как он обрабатывает внешние ссылки?

Вот моя скрипка: http://jsfiddle.net/ZPGe7/1/

Answer 1

Вы не должны кэшировать объект jQuery, потому что он не обновляется, когда элементы получают разные имена классов.Также используйте event.preventDefault(), чтобы предотвратить переход по ссылке.Непосредственно используйте $('.links a.highlight') в своем коде.

Fiddle: http://jsfiddle.net/ZPGe7/2/

$(function() {
    $('.links a').live('click',function(ev){
            $('.links a.highlight').removeClass('highlight');
            $(this).addClass('highlight');
            ev.preventDefault(); //Prevent link from being followed
    });
    $('#submit').live('click',function(){
        $('.links a.highlight').hide();
    });
});