Jquery Помогите с методами find/removeClass/addClass

[Focus]

Хочу поменять класс у элементов. Есть такой хтмл код:

<div id="item-1">
  <span class="status text-success">Ok</div><a href="#" id="active" data-value="1">Doit</a>
</div>
<div id="item-2">
  <span class="status text-success">Ok</div><a href="#" id="active" data-value="2">Doit</a>
</div>
<div id="item-3">
  <span class="status text-success">Ok</div><a href="#" id="active" data-value="3">Doit</a>
</div>
<script language="javascript">
  $form.on('click', '#active', function(e){
  var value = $(this).data('value');
  $status = $form.find("#item-"+value+" .status");
  $status.removeClass(".text-success");
  $status.addClass(".text-warning");
});   
</script>

Почему-то не удаляются/добавляются классы. Подскажите что не так делаю?

 

[Adelf]

Что такое $form?

 

[Focus]

выше в коде идет $form = $('#j-my-items-form'); и в хтмл-е
<form id="j-my-items-form">

 

[Adelf]

Все <a href="#" id="active" data-value="3">

замени на

<a href="#" class="clickDoIt" data-value="3">

И делай
$('#j-my-items-form .clickDoIt').on('click', function(e){
var value = $(this).data('value');
$status = $form.find("#item-"+value+" .status");
$status.removeClass(".text-success");
$status.addClass(".text-warning");

return false; // старайся не забывать возвращать такое, если перекрываешь онклик ссылки
});

 

[WMix]

https://www.w3.org/TR/html401/struct/global.html#h-7.5.2

id = name [CS]
This attribute assigns a name to an element. This name must be unique in a document.

 

[Focus]

поменял как вы написали - все-равно не работает..
Ошибок во время исполнения тоже нет(смотрю с пом. firebug)

 

[Focus]

Заработало так:
вместо:

$status.removeClass(".text-success");
$status.addClass(".text-warning");

написал:

$status.removeClass("text-success");
$status.addClass("text-warning");

Странно, разве должно быть без точки?

 

[Adelf]

Чот точку я даже не увидел. Да должно быть без точки. С точкой оно только в CSS-селекторах. Как здесь - $('#j-my-items-form .clickDoIt')

 

[AnrDaemon]

Все <a href="#" id="active" data-value="3">

замени на

<a href="#" class="clickDoIt" data-value="3">

И делай
$('#j-my-items-form .clickDoIt').on('click', function(e){
var value = $(this).data('value');
$status = $form.find("#item-"+value+" .status");
$status.removeClass(".text-success");
$status.addClass(".text-warning");

return false; // старайся не забывать возвращать такое, если перекрываешь онклик ссылки
});

Не проще убрать "href="#" " ?…

 

[WMix]

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

 

[Adelf]

@AnrDaemon, да я б вообще все поменял
Я только что с проекта с Vue.js(аналог React). Такая красота там.

 

[WMix]

у меня сейчас require и jquery

 

[AnrDaemon]

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

А не надо переворачивать. Сайт должен работать, включён JS или нет.

 

[WMix]

Сайт должен работать, включён JS или нет.

все более шаткий вопрос

 

[Adelf]

+1. Странных людей с выключенным js осталось меньше чем амурских тигров.

 

[Вурдалак]

А не надо переворачивать. Сайт должен работать, включён JS или нет.

Очень громкое и безосновательное утверждение. Никто никому ничего не должен, всё решает бизнес. Если бизнес понимает, что поддержка работоспособности сайта без JS обходится дороже, чем эти самые «странные» пользователи приносят, то логично просто отказаться от этой поддержки.