Найти родительский div и добавить класс

Ищете какую-то помощь здесь, получая .parent() и .find(), работающих на меня ... У меня есть серия DIV на странице, как показано ниже в блоке кода. Я хочу, чтобы, когда пользователь перекатывает .linkerBtnhref, я добавляю новый класс к родительскому уровню верхнего уровня threeCol Div под названием newsFeedItemHovered - пожалуйста, помогите!Найти родительский div и добавить класс

<div class="threeCol"> 
    <div class="threeColInner"> 
    <div class="feedItemWrapper newsFeedItem noBottom"> 
     <h3> 
     <a title="News article 3" href="news-and-events/latest-news/news-article-3.html">News article 3</a> 
     </h3> 
     <p class="ItemStamp">03/09/2015</p> 
     <p>News post summary text... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod euismod euismod. Quisque cursus quam sem, ac fermentum quam molestie in.</p> 
     <p class="noBottom"> 
     <a class="linkerBtn inline small" title="Read more about News article 3" href="news-and-events/latest-news/news-article-3.html">Read more</a> 
     </p> 
    </div> 
    </div> 
</div>

источник

2015-09-04 dubbs

так далее мыши над события сделать что-то вроде этого: $ (это) .closest ('DIV') addClass ('Classname.'); –

'$ (this) .parents ('. 3Col'). AddClass ('...');' также работает. –

$("a.linkerBtn").hover(function() { 
 
    // Add class while hovered over anchor 
 
    $(this).closest(".threeCol").addClass("newsFeedItemHovered"); 
 
}, function() { 
 
    // Remove class when we move away 
 
    $(this).closest(".threeCol").removeClass("newsFeedItemHovered"); 
 
});

.newsFeedItemHovered { 
 
    background-color: lightgrey; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="threeCol"> 
 
    <div class="threeColInner"> 
 
    <div class="feedItemWrapper newsFeedItem noBottom"> 
 
     <h3><a title="News article 3" href="news-and-events/latest-news/news-article-3.html">News article 3</a></h3> 
 
     <p class="ItemStamp">03/09/2015</p> 
 
     <p>News post summary text... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod euismod euismod. Quisque cursus quam sem, ac fermentum quam molestie in.</p> 
 
     <p class="noBottom"><a class="linkerBtn inline small" title="Read more about News article 3" href="news-and-events/latest-news/news-article-3.html">Read more</a> 
 
     </p> 
 
    </div> 
 
    </div> 
 
</div> 
 
<div class="threeCol"> 
 
    <div class="threeColInner"> 
 
    <div class="feedItemWrapper newsFeedItem noBottom"> 
 
     <h3><a title="News article 3" href="news-and-events/latest-news/news-article-3.html">News article 3</a></h3> 
 
     <p class="ItemStamp">03/09/2015</p> 
 
     <p>News post summary text... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer euismod euismod euismod. Quisque cursus quam sem, ac fermentum quam molestie in.</p> 
 
     <p class="noBottom"><a class="linkerBtn inline small" title="Read more about News article 3" href="news-and-events/latest-news/news-article-3.html">Read more</a> 
 
     </p> 
 
    </div> 
 
    </div> 
 
</div>

источник

2015-09-04 21:03:17 Barmar

Легенда .... спасибо - опечатка на твоем 2-м. Все остальное;) – dubbs

Найти родительский div и добавить класс

ответ

Смежные вопросы