jQuery select elements on 1st "level"

Question

I want to select only the elements on the first "level".

Ex:

<div id="BaseElement">
  <p>My paragraph 0</p>
  <div>
    <span>My Span 0</span>
    <span>My Span 1</span>
  </div>
  <span>MySpan 2</span>
  <span>MySpan 3</span>
  <p>My paragraph 1</p>
</div>

Let's say that you got the BaseElement node.

var Element = $("div#BaseElement");

How do I fetch nodes from only the base element node?

$("div#BaseElement span")

should only result in getting MySpan 2 and MySpan 3.

Answer 1

$("#BaseElement").children("span");

or

$("#BaseElement > span");

See jQuery selectors and children().

Answer 2

In the jQuery API, when it refers to 'descendants' it means all levels, and when it refers to 'children' it means only the first level

this will get you all first level children (in your example the first p, div, 2 spans, and last p)

$('#BaseElement > *')