HTML Code

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>jQuery descendant selector demo</title>

  <style>

    form { border: 2px green solid; padding: 8px; margin: 0; background: #efe; }

    fieldset { margin: 8px 0; padding: 8px; }

    div { color: red; margin-bottom: 8px; }

  </style>

</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:</label>

      <input name="newsletter" id="newsletter">

    </fieldset>

  </form>

  <p>Sibling to form: <input name="none"></p>

  <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

  <script>

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

    $("form fieldset input").css("backgroundColor", "yellow");

  </script>

</body>

</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

jQuery form input — official descendant demo (Try It)