# Descendant Selector ("ancestor descendant")

## descendant ( ancestor, descendant ) version added: 1.0

- ancestor
  Type: Selector
  Any valid selector.

- descendant
  Type: Selector
  A selector to filter the descendant elements.

Description: Selects all elements that are descendants of a given ancestor.

A descendant of an element could be a child, grandchild, great-grandchild, and so on, of that element.

## Examples:

#### Example: Mark all inputs that are descendants of a form with a dotted blue border. Give a yellow background to inputs that are descendants of a fieldset that is a descendant of a form.

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>css demo</title>

      <style>

      form {
        border: 2px green solid;
        padding: 2px;
        margin: 0;
        background: #efe;
      }
      div {
        color: red;
      }
      fieldset {
        margin: 1px;
        padding: 3px;
      }

      </style>

      <script src="//code.jquery.com/jquery-1.10.2.js"></script>
    </head>
    <body>

    <form>
      <div>Form is surrounded by the green border.</div>

      <label for="name">Child of form:</label>
      <input name="name" id="name">

      <fieldset>
        <label for="newsletter">Grandchild of form, child of fieldset:</label>
        <input name="newsletter" id="newsletter">
      </fieldset>
    </form>
    Sibling to form: <input name="none">

    <script>

    $( "form input" ).css( "border", "2px dotted blue" );
    $( "form fieldset input" ).css( "backgroundColor", "yellow" );

    </script>

    </body>
    </html>

#### Demo: