在父对象上调用方法之前，从子元素中删除父类（javascript / jquery）

Question

Say I have the following unordered list

<ul class="foo">
  <li>
    <div class="bar">
    </div>
    <div class="baz">
    </div> 
 </li>
 <li>
   <div class="bar">
   </div>
   <div class="baz">
   </div> 
 </li>
</ul>
<div class="nav">
    <a class="prev-link">Previous</a>
    <a class="next-link">Next</a>
</div>

I pass the list to a carousel like so $(".foo").carouFredSel(//options) however i don't want the class bar to be affected by the carousel.

I've tried $('.bar').removeClass('foo') before calling the carousel, but it doesn't seem to work... it is still part of the carousel. How can i prevent that one div from inheriting the parent class or is there a different way I can prevent that div from being treated as part of the carousel ie (just left in place)?

Answer 1

You could try using the !important CSS rule on the .bar class properties you don't want to overwrite. But that's probably not the best use of the rule.

You could also try :not() with the Foo class selector.

Answer 2

如果您要这样做，这将从您的整个ul中删除foo类。

$('.bar').parents('.foo').removeClass('foo');