Javascript jquery添加和删除类

我现在有一个导航菜单，如何在单击任何跨度后添加选定的类，并使用Jquery从上一个跨度中删除选定的类

$（'div.large-12.columns.left.DaySelected>span'）。单击（函数（e）{
e、 preventDefault（）；//防止默认操作
e、 stopPropagation；//停止单击以防止冒泡
$（this）.closest（'span'）.find（'.selected'）.removeClass（'selected'）；
$（this.parent（）.addClass（'selected'）；
});

span.Selected{
背景色：#5e9e37！重要；
颜色：白色！重要；
}

有人能指出我做错了什么吗？

您单击的目标是span，因此

最近（'span'）

将找到自己，因此您下面的

查找（'.selected'）

将找不到“selected”元素：

请尝试以下方法：

Html:

注意事项：

• 将

  最近的

  与

  .DaySelected

  一起使用将确保您不会修改页面上的其他控件。您也可以只使用

  parent（）

  例如

  $（this）.parent（）.find（'.selected'）.removeClass（'selected'）

• 第二行只是将所选的

  类添加到单击的
  span

• 您在html中选择了一个大写的

  S

  on

  on

  。已将其更改为小写

  s

  ，以匹配代码
• 您似乎不需要阻止传播，而且跨度没有要阻止的默认操作。e、 g
• 除了

  e.preventDefault（）

  和

  e.stopPropagation

  之外，您只需

  返回false即可同时执行这两项操作。e、 g

---

正如你在帖子中所说。如果单击当前范围，则可以添加选定类，其余选定类将被删除

$('div.large-12.columns.left.DaySelected > span').click(function(e) {
    e.preventDefault(); // prevent the default action
    e.stopPropagation; // stop the click from bubbling
    $('.Selected').removeClass('Selected');
    $(this).addClass('Selected');
});

注意：在css中，选定的类不是选定的类

---

我认为您的DOM选择是错误的

$('div.large-12.columns.left.DaySelected > span')

应该是

$('div.large-12.columns .left.DaySelected > span')

---

一些小的改进：

已添加）

您的
单击
将绑定在
上。因此，如果您使用
jQuery（this）
它实际上就是您想要更改的范围。因此，您不需要
.parent（）
.find（）
或其他任何东西来将类添加到其中。
不，这些类都位于同一个元素上，因此它是正确的。如果仔细观察，您将看到有两个
div.large-12.columns
列，一个带类，一个不带类。他在点击事件中使用的那个是正确的。我想你是在span only而不是parent中添加和删除所选的类，对吗？@Pete Tong你检查过我的演示了吗，这是你需要的吗？当发布几乎相同的答案时，最早接受（除非有很好的理由不接受）：）对不起，我不知道，现在勾选你的答案
$('div.large-12.columns.left.DaySelected > span')

$('div.large-12.columns .left.DaySelected > span')

$('div.large-12.columns.left.DaySelected > span').click(function(e) {
  e.preventDefault(); // prevent the default action
  e.stopPropagation; // stop the click from bubbling
  $(this).parent().find('.selected').removeClass('selected'); //removes all selected classes in this div
  $(this).addClass('selected');
});