From jQuery JavaScript Library
« Back to Selectors
parent > child
Matches all child elements specified by "child" of elements specified by "parent".
Arguments:| parent | Selector | |
|---|
| Any valid selector. |
| child | Selector | |
|---|
| A selector to match elements that are children of the first selector. |
Examples:| Name | Type |
|---|
Finds all children of the element with id "main" which is yellow.
$("#main > *").css("border", "3px double red");
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="../jquery-latest.js"></script>
<script>
$(document).ready(function(){
$("#main > *").css("border", "3px double red");
});
</script>
<style>
body { font-size:14px; }
span#main { display:block; background:yellow; height:110px; }
button { display:block; float:left; margin:2px;
font-size:14px; }
div { width:90px; height:90px; margin:5px; float:left;
background:#bbf; font-weight:bold; }
div.mini { width:30px; height:30px; background:green; }
</style>
</head>
<body>
<span id="main">
<div></div>
<button>Child</button>
<div class="mini"></div>
<div>
<div class="mini"></div>
<div class="mini"></div>
</div>
<div><button>Grand</button></div>
<div><span>A Span <em>in</em> child</span></div>
<span>A Span in main</span>
</span>
</body>
</html>