JQuery - 부모 형제 요소 찾기

<div>가
  <div class="first_child subDiv">가-1
    <div class="first_child_child subDiv">가-1-1
      <div class="first_child_child_child subDiv">가-1-1-1</div>
    </div>
   </div>
    <div class="second_child subDiv">가-2
       <div class="second_child_child subDiv">가-2-1</div>
    </div>
</div>
<div>나
  <div class="na subDiv">나-1</div>
</div>

🪄부모찾기

👉 parent : 바로 위 부모 하나
$('.second_child').parent().css("background-color", "#aaffaa");

👉 parents : 모든 부모 배열
$('.first_child_child_child').parents().css("background-color", "#ffaaaa");

👉 closet : 부모 중 가장 가까운 하나
$('.na').closest('div').css("background-color", "#aaaaff");

👇 결과

🪄형제찾기

<div>가</div>
<div class="c1">나</div>
<div id="다">다</div>
<div id<="라" class="c1">라</div>
<div>마</div>
<div class="c1">바</div>
<div>사</div>
<div class="c1">아</div>

👉 sibilings : 모든 형제 배열
$('#다').siblings('.c1').css("background-color", "#ffaaaa");

👉 prev(), next() : 이전, 다음 요소
$('#라').prev().css("background-color", "#aaffaa");
$('#라').next().css("background-color", "#33ff33");

👉 eq() : 선택한 요소의 인텍스 번호에 해당하는 요소
$('#다').siblings(':eq(5)').css("background-color", "#aaaaff");

🪄자식찾기

👉 children : 직계 자식만 찾기
$(".first_child").children().css("background-color", "#ffaaaa");

👉 find : 모든 자식 찾기
$(".second_child").find(".subDiv").css("background-color", "#aaffaa");

👇 결과