How to select first child with jQuery

Question

How do I select the first div in these divs  the one with id div1  using first child selectors     lt div class  alldivs  gt      lt div class  onediv  id  div1  gt      lt  div gt      lt div class  onediv  id  div2  gt      lt  div gt      lt div class  onediv  id  div3  gt      lt  div gt   lt  div gt

User · Answer

Hi we can use default method  first  in jQuery  Here some examples   When you want to add class for first div        alldivs div   first   addClass  active      When you want to change the remove the  onediv  class and add only to first child         alldivs div   removeClass  onediv   first   addClass  onediv

User · Answer

As  Roko mentioned you can do this in multiple ways   1 Using the jQuery first-child selector - SnoopCode       document  ready function            alldivs onediv first-child   css  background-color   yellow                 Using jQuery eq Selector - SnoopCode       body    find   onediv    eq 1  addClass   red      Using jQuery Id Selector - SnoopCode       document  ready function             div1   css  background-color  red

User · Answer

Use the  first-child selector   In your example        div alldivs div first-child     This will also match any first child descendents that meet the selection criteria      While  first matches only a single element  the  first-child selector can match more than one  one for each parent  This is equivalent to  nth-child 1     For the first matched only  use the  first selector   Alternatively  Felix Kling suggested using the direct descendent selector to get only direct children        div alldivs  gt  div first-child

User · Answer

Try with      onediv   eq 0  demo jsBin From the demo  Other examples of selectors and methods targeting the first LI unside an UL    eq   Method     li   eq 0   eq   selector     li eq 0     first   Method    li   first    first selector     li first    first-child selector     li first-child    lt   selector    li lt 1     nth-child   selector    li nth-child 1     jQ   JS   Array slice   Method     li   slice 0 1   you can also use  i  to get the JS HTMLelement index out of the jQuery el   array  collection like eg     li   0   now that you have the JS element representation you have to use JS native methods eg     li   0  className    active      Adds class  quot active quot  to the first LI in the DOM  or you can  don t - it s bad design  wrap it back into a jQuery object       li   0    addClass  active       Don t  Use  eq   instead

User · Answer

div alldivs  first-child      Or you can just refer to the id directly       div1      As suggested  you might be better of using the child selector      div alldivs  gt  div first-child     If you dont have to use first-child  you could use  first as also suggested  or     div alldivs   children 0

[javascript] How to select first child with jQuery?

Examples related to javascript

Examples related to jquery

Examples related to children