切换单个元素类，尽管它有多个实例

简单的事情，我只是无法让它工作：

我有几个段落共享相同的类，我只是想改变其中一个类，因为他们的父div被hover。

 
 some content 
 /div> 
 
 some content 
 /div> 

当我hover第一个“trigger-div”时，我希望它的p改变而不影响后面的元素

 
 
 some content 
 /div> 
 
 some content 
 /div> 

我有以下代码不起作用：//

 $('.trigger').hover(function() { $(this).next(".oldstyle").toggleClass("newstyle"); }); 

我很无奈！ 万分感谢。

Answer 1

尝试孩子，因为它不是兄弟姐妹：

 $('.trigger').hover(function() { $(this).children(".oldstyle").toggleClass("newstyle"); }); 

Answer 2

我赞成现有的答案，我想我会为优化目的提供另一个答案：

 $('.trigger').on({ mouseenter:function(){ $(this).find('.oldstyle').addClass('newstyle'); }, mouseleave:function(){ $(this).find('.oldstyle').removeClass('newstyle'); } }); 

这是.hover()和.toggleClass()一个更明确的版本，如果你多次进入/离开太多次，我只是很糟糕地经历了.toggleClass()多次.toggleClass() ，并且明确地这样做就消除了问题。 我也使用.find()而不是.find() ，因为一般来说，由于缺少“直接孩子”validation，它的运行速度比.children()快。