Descendant

Syntax

$('E F')

Description

Select all elements matched by F that are descendants of an element matched by E. $("ancestor descendant") returns a wrapper object with the descendants of a specified ancestor.

Descendants of an element are that element's children, grandchildren, great-grandchildren, and so on.

 
<div id="container">
 <div id="inner">
     <p>
         <span><img src="example.jpg" alt="" /></span>
     </p>
 </div>
</div>

For HTML code above, the <img> element is a descendant of the <span>, <p>, <div id="inner">, and <div id="container"> elements.

Examples

Selector	Selects
$("form input")	a wrapper with all of the inputs that are children of a form.
$('#container p')	all paragraph elements that are descendants of an element that has an ID of container.
$('a img')	all <img> elements that are descendants of an <a> element.

 
<html>
  <head>
    <script type="text/javascript" src="http://java2s.com/Book/JavaScriptDemo/jQuery/jquery-1.8.0.min.js"></script>
    <script type="text/javascript">
      $(document).ready(function(){
        $("form input").css("border", "2px solid red");
      });
    </script>

  </head>
  <body>
      <form>
        <label>Child:</label>
        <input name="name" />
        <fieldset>
          <label>Grandchild:</label>
          <input name="newsletter" />
        </fieldset>
      </form>
  </body>
</html>

Click to view the demo

Home
JavaScript Book
jQuery

Selector: