JQuery Sub Selector question

Question

my html

<div id="x">
  <div id="x1">
    some text
    <div>other text</div>
  </div>
  <div id="x2">just text</div>
<div>

my call

I have this element than can be any jquery selector, 1 or more elements:

var x = $("#x");

now I NEED (this is a plugin who will discover inner elements like tabs) to navigate only thru the firsts DIV elements and not its childrends. I'm trying...

$.each($($("div"), x), function() {
  alert($(this).html());
});

shows: 1. some textother text 2. other text 3. just text

$.each($($("div"), x).siblings(), function() {
  alert($(this).html());
});

shows: 1. just text 2. some textother text

this is the most approximate, but I need in the correct order. any suggestion ? thanks

ps. because it's a plugin I cant do this.

$("#x", "div....")

I need to do this

#(newselector, x)

Answer 1

Use:

$("#x > div")

as your selector - it will only select the direct children of the div whose id is x.

Answer 2

This method will give you the all the internal text of a div:

x.children('div').each(function() {
  alert($(this).text());
});

If you don't want all the text combined from multiple child divs, you could access only the direct text node of each:

x.children('div').each(function() {
  alert(this.childNodes[0].nodeValue);
});

Note: assuming x is a Jquery element defined by var x = $('#x').

Answer 3

If you cannot use $("#x > div") because it should work with all selectors you think of then assuming you defined that specific selector to var x:

var x = $('#x');

// this will select only the direct div children of x whatever the x is
x.children('div');