Javascript 遍历选择器，按单击元素的索引编号

我想通过单击元素的索引号遍历选择器

像这样：

选择一个div的第二个子项（#tabby content）

单击其他div的第二个子项（#tabby标签）时

问题在下面解决了。但是有人知道如何“清理代码”并以更好的方式实现同样的事情吗

$("#tabby-labels > .first").click(function() {
        $("#tabby-content > .first").siblings('.active').removeClass('active').addClass('inactive');
        $("#tabby-content > .first").addClass('active').removeClass('inactive');
});

$("#tabby-labels > .second").click(function() {
        $("#tabby-content > .second").siblings('.active').removeClass('active').addClass('inactive');
        $("#tabby-content > .second").addClass('active').removeClass('inactive');
});
    $("#tabby-labels > .third").click(function() {
        $("#tabby-content > .third").siblings('.active').removeClass('active').addClass('inactive');
        $("#tabby-content > .third").addClass('active').removeClass('inactive');
});
    $("#tabby-labels > .fourth").click(function() {
        $("#tabby-content > .fourth").siblings('.active').removeClass('active').addClass('inactive');
        $("#tabby-content > .fourth").addClass('active').removeClass('inactive');
});

---

谢谢

我认为这样做可以：

$("#tabby-label > *").click(function() {
    var index = $(this).index();
    $("#tabby-contents").children('.active').toggleClass("active inactive");
    $("#tabby-contents").children().eq(index).addClass("active").removeClass("inactive");
});

它假设相关元素是两个div的唯一直接子元素