<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://code.jquery.com/jquery-3.1.1.js"></script>
</style>
<script>
$(function(){
$("ul").children("li").css("background-color","red");
});
</script>
</head>
<body>
<ul>
<li>회사소개</li>
<li class="menu">제품소개</li>
<li>커뮤니티
<ul>
<li>게시판</li>
<li>소개글</li>
<li>질문과답변</li>
</ul>
</li>
<li>다운로드</li>
<li>연혁</li>
</ul>
</body>
</html>
$(function(){
$("ul").children("li").css("background-color","red");
});
이러케해버리면 ul달린애의 밑에 list는 다선택되니까 저깃는 리스트 다선택됨
그럼 하나 클래스 주고 해보면
----------------------------------------------------------------------------------
<!doctype html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="http://code.jquery.com/jquery-3.1.1.js"></script>
</style>
<script>
$(function(){
$(".gnb").children("li").css("background-color","red");
});
</script>
</head>
<body>
<ul class="gnb">
<li>회사소개</li>
<li class="menu">제품소개</li>
<li>커뮤니티
<ul>
<li>게시판</li>
<li>소개글</li>
<li>질문과답변</li>
</ul>
</li>
<li>다운로드</li>
<li>연혁</li>
</ul>
</body>
</html>
이케해주면 gnb밑의 li들만 (손자말고 자식만!) 해당된다 css로쳣을떄 ul>li 이런느낌! 바로다음자식만 선택