Метод .siblings() находит соседей элемента внутри одного родителя.
См. также методы prev и next, которые находят соседей сверху и снизу.
См. также урок основы работы с jQuery для более полного понимания.
Синтаксис
Получение соседей:
.siblings()
Можно также пофильтровать соседей по заданному селектору (в наборе останутся только те соседи, которые удовлетворяют этому селектору):
.siblings(селектор)
Примеры
Пример
Давайте найдем элемент #test и всем его соседям поставим текст '!' с помощью html:
<p>Абзац вне дива.</p>
<div>
<p>Абзац.</p>
<p>Абзац.</p>
<p id="test">Абзац.</p>
<p>Абзац.</p>
<p>Абзац.</p>
</div>
<p>Абзац вне дива.</p>
$('#test').siblings().html('!');
HTML код станет выглядеть так:
<p>Абзац вне дива.</p>
<div>
<p>!</p>
<p>!</p>
<p id="test">Абзац.</p>
<p>!</p>
<p>!</p>
</div>
<p>Абзац вне дива.</p>
Пример
Давайте найдем элемент #test и всем его соседям с классом .www поставим текст '!' с помощью html:
<p>Абзац вне дива.</p>
<div>
<p>Абзац.</p>
<p class="www">Абзац.</p>
<p>Абзац.</p>
<p id="test">Абзац.</p>
<p>Абзац.</p>
<p class="www">Абзац.</p>
<p>Абзац.</p>
</div>
<p>Абзац вне дива.</p>
$('#test').siblings('.www').html('!');
HTML код станет выглядеть так:
<p>Абзац вне дива.</p>
<div>
<p>Абзац.</p>
<p class="www">!</p>
<p>Абзац.</p>
<p id="test">Абзац.</p>
<p>Абзац.</p>
<p class="www">!</p>
<p>Абзац.</p>
</div>
<p>Абзац вне дива.</p>