<div>
<div class="content wysiwyg-content">
Given the following html:<br />
<br />
&lt;div class='module'&gt;<br />
&nbsp; &nbsp;&lt;div id='a' class='element'&gt;<br />
&nbsp; &nbsp; &nbsp; &lt;div class='element'&gt;&lt;/div&gt;<br />
&nbsp; &nbsp; &nbsp; &lt;div class='element'&gt;&lt;/div&gt;<br />
&nbsp; &nbsp;&lt;div id='b' class='element'&gt;&lt;/div&gt;<br />
&nbsp; &nbsp;&lt;div&gt;<br />
&nbsp; &nbsp; &nbsp; &lt;div id='c' class='element'&gt;&lt;/div&gt;<br />
&nbsp; &nbsp;&lt;/div&gt;<br />
&lt;/div&gt;<br />
<br />
What should the jquery selector look like in order to grab the first descendants of class &quot;element&quot;, but not any of the descendants which have the class element. To clarify, the selector should return the elements with id a,b,c as assigned above.<br />
<br />
$('.module .element:XXXX'); ???
</div>
</div>


Given the following html:

<div class='module'>
   <div id='a' class='element'>
      <div class='element'></div>
      <div class='element'></div>
   <div id='b' class='element'></div>
   <div>
      <div id='c' class='element'></div>
   </div>
</div>

What should the jquery selector look like in order to grab the first descendants of class "element", but not any of the descendants which have the class element. To clarify, the selector should return the elements with id a,b,c as assigned above.

$('.module .element:XXXX'); ???

jQuery: how to i grab elements of a certain depth?

jQuery (Core) is a cross-browser JavaScript library that provides abstractions for common client-side tasks such as Document Object Model (DOM) traversal, DOM manipulation, event handling, animation and Ajax. jQuery also provides a platform to create plugins that extend jQuery's capabilities beyond those already provided by the library.