Target DOM elements in jquery

Question

I have the following html

<ul id="some_nav">
   <p>Tester</p>
</ul>
<div class="packs"></div>

<ul id="some_nav">
    <p>Jones</p>
</ul>
<div class="packs"></div>

<ul id="some_nav">
    <p>Trey</p>
</ul>
<div class="packs"></div>

I was wondering how I could target the class .packs that comes after the <p>Jones</p>

Answer 1

You should arrange your DOM structure but here you go:

$("p:contains('Jones')").parent().next();

First this selects all p elements that have the text Jones, then it goes up to its parent and then select the next sibling of each result.

Working demo

Reference

http://api.jquery.com/contains-selector/

http://api.jquery.com/parent/

http://api.jquery.com/next/