デモページはこちら

jQueryで兄弟要素（同階層の要素）を取得するメソッドのまとめです。対象要素の直後の要素を取得するnext、対象要素の直後以降の要素を全て取得するnextAll、対象要素の直前の要素を取得するprev、対象要素の直前以前の要素を全て取得するprevAll、対象要素と同階層の要素を全て取得するsiblingsです。

以下のhtmlの構造でテストします。

<p class="title">タイトルデモ</p>
<p>ダミーテキスト01</p>
<p>ダミーテキスト02</p>
<p>ダミーテキスト03</p>
<div class="image">
	<img src="images/img01.jpg" alt="">
	<img src="images/img02.jpg" alt="">
	<img src="images/img03.jpg" alt="">
	<img src="images/img04.jpg" alt="">
</div>
<p>ダミーテキスト04</p>
<p>ダミーテキスト05</p>

兄弟要素を取得できる各メソッドを利用してconsole.logで出力します。

$(function() {
	var result01 = $('.title').next('p');
	var result02 = $('.title').nextAll('p');
	var result03 = $('.image').prev('p');
	var result04 = $('.image').prevAll('p');
	var result05 = $('.image').siblings('p');

	console.log(result01.text());
	console.log(result02.text());
	console.log(result03.text());
	console.log(result04.text());
	console.log(result05.text());
});

//result01
ダミーテキスト01
//result02
ダミーテキスト01ダミーテキスト02ダミーテキスト03ダミーテキスト04ダミーテキスト05
//result03
ダミーテキスト03
//result04
ダミーテキスト03ダミーテキスト02ダミーテキスト01タイトルデモ
//result05
タイトルデモダミーテキスト01ダミーテキスト02ダミーテキスト03ダミーテキスト04ダミーテキスト05