Метод closest() не работает должным образом

Question

У меня есть пример ниже, я не уверен, почему первый пример (используя div s) не получил текст, когда второй (используя span s) может достичь этого с помощью того же кода JS, используя closest():

$('.class-1').closest('div').find('.class-2').text()

---

Первый фрагмент (используя div s) не могу получить текст, используя closest() :

console.log( $('.class-1').closest('div').find('.class-2').text() );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <div class="class-1">Div 1 Content</div>
  <div class="class-2">Div 2 Content</div>
</div>

---

Второй фрагмент (используя span s) получение текста с использованием closest() :

console.log( $('.class-1').closest('div').find('.class-2').text() );

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <span class="class-1">Div 1 Content</span>
  <br/>
  <span class="class-2">Div 2 Content</span>
</div>

Я знаю об альтернативах parents()/parent()/siblings()/nextAll() что может вернуть class-2 Текст в этом случае, но я хочу просто знать, что происходит это поведение.

Answer 1

Так как .closest() проверяет, подходит ли вызывающий элемент к селектору, и в вашем случае .class-1 также div,

Из документов:

Описание: для каждого элемента в наборе получите первый элемент, который соответствует селектору, проверив сам элемент и пройдя через его предков в дереве DOM.