The method is intended for searching in the selection find.
It has the following use cases:
- find(selector): search in the selection of objects that match the selector
- find(element): search in the selection of objects corresponding to the given HTML element
- find(jQuery): searches a selection of objects that match a jQuery object
The find method returns a new selection on output. For example, we have the following menu markup in the form of lists:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | < ul class = "menu" > < li >Point 1</ li > < li >Item 2 < ul class = "submenu" > < li >Subclause 2.1</ li > < li >Subclause 2.2</ li > </ ul > </ li > < li >Item 3 < ul class = "submenu" > < li >Subclause 3.1</ li > < li >Subclause 3.2</ li > </ ul > </ li > </ ul > |
Now let’s search for the selector, element, and jQuery object in sequence:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | $( function (){ // search by selector var array0 = $( 'ul' ).find( '.submenu' ); array0.css( 'background-color' , 'silver' ); // element search // get the first element of the selection varelem = $( 'ul.submenu' )[0]; var array1= $( 'ul' ).find(elem); array1.css( 'background-color' , 'gray' ); // Find jQuery object var jQueryObject = $( 'ul.submenu' ); var array2= $( 'ul' ).find(jQueryObject); array2.css( 'color' , 'blue' ); }); |