jQuery - найти 1-й элемент с определенным классом сверху, но не перед другим элементом

Question

HTML выглядит примерно так:

<li class="divider">
  <div>
    ...(maybe more divs)...      
      <div class="content">
         ...(maybe more divs)...
         <a href="#" class="link">LINK</a>

...

как я могу выбрать .content DIV из функции jQuery, подключенной к ссылке?Обратите внимание, что у меня есть несколько списков, подобных этому, и в некоторых из них div.content может отсутствовать, поэтому я хочу выбирать этот div, только если он существует в текущем блоке (li.divider).

Я пыталсяс $link.parent().parent().find('content'), но в некоторых случаях происходит сбой, поскольку число элементов между этими двумя элементами может измениться ...

Answer 1

Если они не вложенные, вы можете сделать это:

$('a.link').click(function() {
    $(this).closest('div.content');
});

или

$('a.link').click(function() {
    $(this).parents('div.content:first');
});

Если они вложенные, то вам может потребоваться сделать что-то вродеэто:

$('a.link').click(function() {
    $(this).closest('li.divider').find('div.content');
});

... так что, если происходит вложение, а в текущем нет div.content, вы не выберете более отдаленного предка div.content.

• http://api.jquery.com/closest/
• http://api.jquery.com/parents/

Answer 2

Используйте селектор closest ...

var parentContent = $(this).closest("div.content");

if(parentContent.length > 0) {
  alert("DIV was found!");
}

Answer 3

$link.parent(".content") * * 1002