Добавить класс в элемент на клике, когда он имеет определенный класс

Question

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

Это исходный код: -

<script> 
    $(document).ready(function() { 
    if ($('#headerContent ul li a').hasClass('select')) { 
    $('#headerContent ul li a').addClass('Blue'); 
    } 
    }); 
</script> 

Это мой переписывают, который, кажется, не работает.

<script> 
    $(document).ready(function() { 
     if ($('#headerContent ul li a').hasClass('select')).onClick(function() { 
    $('#headerContent ul li').addClass('Blue');}) 
    }); 
</script> 

EDIT:

Это я чувствую, не дубликат! Может быть, я должен был объяснить это больше. Я использую это в сочетании с плагином jquery для прокрутки, который добавляет выбор класса при нажатии! Я использую этот плагин Smooth scrolling, который добавляет класс выбора к тегу привязки.

Я поставил jsfiddle вместе:

http://jsfiddle.net/axajLjb1/1/

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

Answer 1

Если вы хотите прикрепить анкерный элемент ти событий, которые имеют выбор, то:

$(document).ready(function() { 
$('#headerContent ul li a.select').click(function() { 
$('.Blue').removeClass('Blue'); 
$(this).parent().addClass('Blue');//add class blue to currently clicked anchor with class select 
}); 
}); 

Если вы хотите, чтобы щелчок, чтобы быть произошло только тогда, когда элемент имеет выбор, то вы можете использовать либо событие делегации или добавить обработчик проверки выше, чтобы проверить, имеет ли элемент класс.

$(document).ready(function() { 
    $('#headerContent ul li').on('click','a.select',function() { 
    $('.Blue').removeClass('Blue'); 
    $(this).parent().addClass('Blue');//add class blue to currently clicked anchor with class select 
    }); 
}); 

Answer 2

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

$(document).ready(function() { 
    $('#headerContent ul li').on('click', 'a.select', function() { 
     $(this).addClass('Blue'); 
    }); 
}); 

Я хотел добавить класс синий с литий когда анкерный тег имеет класс «Выбрать».

Итак, используйте:

$(document).ready(function() { 
    $('#headerContent ul li').on('click', 'a.select', function() { 
     $(this).closest('li').addClass('Blue'); 
    }); 
}); 

А теперь я задаюсь вопросом, если вы хотите по щелчку или нет ?! Если нет, но когда .select класс добавляется плагином, это, безусловно, проблема XY. Ваш вопрос слишком плохо спрошен imho ... И в этом случае используйте любой обратный вызов плагина, проверьте DOC. Но, конечно, мы не знаем, с каким плагином вы говорите, поэтому ...