jQueryを使うと、 `find（）`を使ってすべての子孫（子、孫、曾孫…どんなレベルでも）を検索することができます。
例えば、3つのレベルの深さを持つ `div`要素です。
<div id="A1">
<div class="child">A1-1</div>
<div class="child">A1-2</div>
<div id="A2">
<div class="child">A2-1</div>
<div class="child">A2-2</div>
<div id="A3">
<div class="child">A3-1</div>
<div class="child">A3-2</div>
</div>
</div>
</div>
1. $（ ‘＃A1’）. find（ ‘. child’）
$('#A1').find('.child').css('background','red');
“A1″のIDを含む要素と、 ”
child
“というクラス名を含む子要素を見つけ、背景を赤に変更します。
2. $（ ‘＃A2’）. find（ ‘. child’）
$('#A2').find('.child').css('background','red');
“A2″のIDを含む要素と、 ”
child
“というクラス名を含む子要素を見つけ、その背景を赤に変更します。
3. jQuery find（）の例
この例を再生します。
HTMLの例
<html>
<head>
<script type="text/javascript" src="jquery-1.3.2.min.js"></script>
<style type="text/css">
div{
padding:8px;
border:1px solid;
}
</style>
</head>
<body>
<h1>jQuery find() example</h1>
<script type="text/javascript">
$(document).ready(function(){
$("#button1").click(function () {
$('div').css('background','white');
$('#A1').find('.child').css('background','red');
});
$("#button2").click(function () {
$('div').css('background','white');
$('#A2').find('.child').css('background','red');
});
$("#button3").click(function () {
$('div').css('background','white');
$('#A3').find('.child').css('background','red');
});
});
</script>
</head>
<body>
<div id="A1">A1
<div class="child">A1-1</div>
<div class="child">A1-2</div>
<div id="A2">A2
<div class="child">A2-1</div>
<div class="child">A2-2</div>
<div id="A3">A3
<div class="child">A3-1</div>
<div class="child">A3-2</div>
</div>
</div>
</div>
<br/>
<br/>
<br/>
<input type='button' value='find #A1' id='button1'>
<input type='button' value='find #A2' id='button2'>
<input type='button' value='find #A3' id='button3'>
</body>
</html>
