<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>노드찾기</title>
<style>
*{font-size: 14px; color:#333;}
div, p, ul, li, h1, h3{
margin:10px;
padding:10px;
border:1px solid #aaa;
}
.select{
background-color:#ccc;
}
strong{
background-color:#ccc;
}
.test1{
border-color:#f06;
}
.test2{
border-color:#08f;
}
</style>
</head>
<body>
<div id="wrap">
div, #wrap
<div class="header">
div, .header
<h1>h1</h1>
<p class="tit">p, .tit</p>
<p class="test2">p, .test2</p>
</div>
<div class="section">
div, .section
<ul class="menu">
ul, .menu
<li>list1</li>
<li>list2</li>
<li class="select">list3, .select</li>
<li>list4</li>
<li>list5</li>
</ul>
<div class="box">
div, .box
<p>p</p>
<p>p <strong>strong</strong></p>
<p>p <strong>strong</strong></p>
</div>
<p class="test1">p, .test1</p>
<p class="test2">p, .test2</p>
</div>
<div class="content">
div, .content
<div class="con">
div, .con
<h3>h3</h3>
<ul class="list">
ul, .list
<li>li</li>
<li class="test2">li, .test2</li>
<li>li
<strong class="st">strong, .st</strong></li>
</ul>
</div>
<div class="space">
div, .space
<div class="item">div, .item</div>
<div class="item">div, .item</div>
<div class="item">div, .item</div>
</div>
</div>
<div class="footer">
div, .footer
<h1 class="flogo">h1, .flogo</h1>
<ul class="fmenu">
ul, .fmenu
<li>li</li>
<li class="test1">li</li>
<li>li</li>
<li>li
<strong class="st">strong, .st</strong></li>
</ul>
<div class="cr">
div,.cr
<div class="box">
div, .box
<p>p</p>
<p class="test1">p, .test1</p>
<p class="test2">p, .test2</p>
</div>
<div class="box">
div, .box
<p>p</p>
<p class="test1">p, .test1</p>
<p class="test2">p, .test2</p>
</div>
</div>
</div>
</div>
<script src="js/jquery-3.6.0.min.js"></script>
<script>
$(".header h1").on("click", function() {
$(this).css("backgroundColor","dodgerblue");
})
$(".header h1").on("click", function() {
$(this).parent().next().find("li").eq(1).css({
"borderColor" : "red",
"backgroundColor" : "lawngreen"
})
})
$(".section .select").on("click", function() {
$(this).parents(".section").siblings().last().find(".flogo").css("backgroundColor","tomato")
})
</script>
</body>
</html>