jQuery - родительские селекторы

Question

Я не могу узнать, как именно работает родительский селектор в jQuery.

var test = $("p:contains('Lorem ipsum dolor sit amet')").parentsUntil("span"); 
 
    
 
    
 
    test.css({ "border" : "1px solid red"});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    \t \t \t <p>Title</p> 
 
    \t \t \t <span> 
 
    \t \t \t \t <p>Span</p> 
 
    \t \t \t \t <div> 
 
    \t \t \t \t \t <p>Div</p> 
 
    \t \t \t \t \t <p>Lorem ipsum dolor sit amet</p> 
 
    \t \t \t \t </div> 
 
    \t \t \t </span> 
 
    \t \t \t <tr> 
 
    \t \t \t \t <th>Xx</th> 
 
    \t \t \t \t <td>YY</td> 
 
    \t \t \t </tr> 
 
    \t \t </table>

Как получить рамку вокруг пролете? Мой код не работает.

Answer 1

Вам просто нужно использовать .closest() вместо того, чтобы, наряду с .parent():

var test = $("p:contains('Lorem ipsum dolor sit amet')").parent().closest("span"); 

UPDATE

Вы также можете продолжать использовать parentsUntil(), но добавить родителя() по понятным причинам:

var test = $("p:contains('Lorem ipsum dolor sit amet')").parentsUntil("span").parent(); 

Но это не будет работать, если прямой родитель типа «пролет», потому что parentsUntil исключает текущий элемент.