Как удалить класс, если элемент имеет класс, который я ищу с помощью jQuery?

Question

<a href='1.html' onclick='return false' class='selected'>video 1</a>
<a href='2.html' onclick='return false' class=''>video 2</a>
<a href='3.html' onclick='return false' class=''>video 3</a>
<a href='4.html' onclick='return false' class=''>video 4</a>

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

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

Я попробовал следующее, и это не сработало

$('a').hasClass('selected').removeClass('selected');

но, видимо, это неправильная функция и выдает сообщение об ошибке в журнале ошибок в Firefox.

Answer 1

.hasClass() возвращает логическое значение . Просто используйте API селектора соответствующим образом:

$('a.selected').removeClass('selected');

Тем не менее, это логически эквивалентно:

$('a').removeClass('selected');

Answer 2

$("a.selected").removeClass("selected");

Answer 3

$('a').click(function(e){
  // current link
  var $link = $(this);

  // find all siblings (fellow links) and remove selected class
  $link.siblings('a.selected').removeClass('selected');

  // make sure this class has the elected class
  $link.addClass('selected');
});