Javascript jQuery-添加和删除类

我试图使它成为一个默认选项卡，当单击另一个选项卡时，它会将该类从该选项卡中移除，并放到被单击的选项卡上

以下是我拥有的HTML：

<div id="rightWrap">
    <div id="headStep"><span class="titleSub">Workers</span></div>
    <center>
    <br>
    <a href="../about/?s=architect"><table class="highlight">
    </table></a>
    <br>
    <a href="../about/?s=broker"><table class="">
    </table></a>
    <br>
    <a href="../about/?s=operator"><table class="">
    </table></a>
    <br>
    <a href="../about/?s=consultant"><table class="">
    </table></a>
    </center>
</div>

---

你的桌子不是兄弟姐妹

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
        var $this = $(this);
        $this.parent().siblings('a').find('table').removeClass('highlight');
        $this.addClass('highlight');     
    });
});

---

请注意，如果页面的doctype不是HTML5，则使用

元素包装表格会使文档无效。

表格不是同级

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
        var $this = $(this);
        $this.parent().siblings('a').find('table').removeClass('highlight');
        $this.addClass('highlight');     
    });
});

---

请注意，如果页面的doctype不是HTML5，则使用

元素包装表格会使文档无效。

我认为您可以将其简化为以下内容：

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
        $('#rightWrap').find('.highlight').removeClass('highlight');
        $(this).addClass('highlight');     
    });
});

---

你的HTML也需要一些认真的工作。为什么是空桌子？

我想你可以简化成这样

$(document).ready(function() {
    $('#rightWrap a table').click(function(){
        $('#rightWrap').find('.highlight').removeClass('highlight');
        $(this).addClass('highlight');     
    });
});

---

你的HTML也需要一些认真的工作。为什么是空表？

@johncode感谢您的编辑，但编辑后的代码与原始代码没有区别。在HTML5中，使用

标记包装块级元素（如表）是完全合法的，许多浏览器已经允许了这一点。空表对我来说毫无意义。@jfriend00是的，我知道它在HTML5中是合法的，我认为表标记有它们的on标记，OP没有发布它们以简洁明了。@johncode感谢编辑，但编辑后的代码和原始代码之间没有区别。在HTML5中，包装块级元素（如表）是完全合法的带有

标记，而且许多浏览器已经允许这一点有一段时间了。空表对我来说毫无意义。@jfriend00是的，我知道它在HTML5中是合法的，我认为表标记有它们的标记，OP为了简洁没有发布它们。