javascript - 当外部div和内部div具有相同的类时，要删除内部div的类

<div class="test">
  <div class="test">
    <div class="test">
       Test Content
    </div>
  </div>
</div>

我想删除内部div的类测试。我可以使用下面的代码来做到这一点，但正在寻找更通用的n级方法。请引导我正确的方法来实现这一目标。

<script>
  $(document).ready(function(){
    // this will delete class test of level 1
    $($(".test")[1]).removeClass('test');
    //or
    // this will delete class test of level 2
    $($(".test")[2]).removeClass('test');
  });
</script>

Fiddle

Updated Fiddle仍然无法正常工作。

谢谢

最佳答案

这应该工作：

$(function() {
  $("div.test > div.test").removeClass("test");
});

它获得一个类div的test，该类是另一个div类test的直接后代，并删除其类。

您还可以使其具有以下功能：

function removeDuplicateClass(cls) {
    return $("div." + cls + " > div." + cls).removeClass(cls).length;
}

编辑：看到编辑后，这应该工作

function removeDuplicateClass(cls, level) {
  // get all top level divs with that class
  var parent = $("div." + cls).filter(function () {
    return !$(this).parent().is("div." + cls);
  });

  // build selector
  var selector = [];
  for (var i = 0; i < level; ++i) {
    selector.push("> div." + cls);
  }

  // now remove class
  return $(selector.join(" "), parent).removeClass(cls).length;
}