CODEWITHSUNDEEP
javascriptjqueryhtml
Offirmo
Offirmo

Reputation: 19860

Meaning and usage of jquery find('>')

I'm working on a javascript code which does :

$('div').html(<some text>).find('>')

Looking at the jQuery documentation, I can't understand what find('>') is supposed to do.

Moreover, when experimenting in navigator console, I get strange results :

$('div').html('to<br/>to').find('>') -> [ <br>​, <br>​, <br>​]

$('div').html('to<a/>to').find('>') -> [ <a>​</a>​, <a>​</a>​, <a>​</a>​]

Why a 3 times repetiton ?

So, can anyone enlighten me about this strange find('>') ?

Upvotes: 1

Views: 83

Answers (2)

James Donnelly
James Donnelly

Reputation: 128776

> is the Child Combinator CSS selector. .find('>') will pull all direct children of the element.

As mentioned in comments, the repetitions must be due to your document having multiple div elements.

Update

From your comment:

I thought the line was creating a div then setting some html into it.

$('div') itself selects all div elements which exist within document. If you want to create a div element, you can instead do this:

$('<div/>', { html: 'to<br/>to' });

If you're new to jQuery, I'd strongly advise checking out http://try.jquery.com and http://learn.jquery.com.

Upvotes: 6

Oscar Paz
Oscar Paz

Reputation: 18302

As someone pointed out, '>' selects the child elements of an element.

Why 3? Because surely you have 3 divs, so

$('div')        //selects 3 divs
   .html(...)   // adds content to each div
   .find('>');  //return the direct descendants of each element in the jQuery object 
                //as a new jQuery object

Upvotes: 3

Related Questions