Javascript & JQuery & CSS

siblings() 객체는 item객체와 동일한 위치에 있는 모든 객체 (자신을 제외한 형제요소) 를 검색할 수 있는 메소드 입니다.

				<ul>
					<li>list item 1 </li>
					<li>list item 2 </li>           
					<li>list item 3 </li>
					<li>list item 4 </li>
					<li>list item 5 </li>
				</ul>
				
				$(document).ready(function() {
					$("li").each(function () {
						$(this).click(function () {
							$(this).addClass("selected");
							$(this).siblings().removeClass("selected");
						});
					});
				});

ul 태그 밑에 li 태그의 형제들이 5개가 있습니다.
$(this).click 이 객체들을 클릭했을 경우,

$(this).addClass("selected");
$(this).siblings().removeClass("selected");

이 두줄의 프로그램이 실행이 됩니다. $(this).siblings() 함수가 실행되는데요.

여기에서 $(this) 객체가 li 태그이기 때문에 클릭한 this 태그를 제외한 나머지 객체는 removeClass("selected"); 명령이 실행되어 style 이 없어지게 됩니다.

				<ul>
					<div id="orange">오렌지</div>
					<div class="p">바나나</div>
					<div class="p">파인애플</div>
					<div class="p">사과</div>
					<div class="paa">제주감귤 </div>
				</ul>

위 소스와 같은 태그가 존재합니다.
orange id 를 기준으로 형제 태그중 class 가 '.P' 인것을 찾고자 합니다.
이런 경우
$("#orange").siblings(".p").css("color","#ff0000");

위 소스와 같은 형식으로 구현 할 수 있습니다.
형제 요소중 siblings(".p") 통해 class="p" 인 객체를 검색 할 수 있습니다. 제주감귤 과 오렌지 태그는 제외 됩니다.......