Get second child using jQuery

Question

t  html     returns    lt td gt test1 lt  td gt  lt td gt test2 lt  td gt    I want to retrieve the second td from the   t  object  I searched for a solution but nothing worked for me  Any idea how to get the second element

User · Answer

Use  find   method    t  find  td eq 1      td eq x     x is index of child you want to retrieve  eq 1  means equal to 1    1 denote second element

User · Answer

You can use two methods in jQuery as given below-  Using jQuery  nth-child Selector You have put the position of an element as its argument which is 2 as you want to select the second li element   x000D   x000D      ul li nth-child 2     click function    x000D      do something x000D      x000D   x000D   x000D    Using jQuery  eq   Selector  If you want to get the exact element  you have to specify the index value of the item  A list element starts with an index 0  To select the 2nd element of li  you have to use 2 as the argument    x000D   x000D      ul li eq 1     click function    x000D      do something x000D      x000D   x000D   x000D    See Example  Get Second Child Element of List in jQuery

User · Answer

In addition to using jQuery methods  you can use the native cells collection that the  lt tr gt  gives you     t  0  cells 1  innerHTML   Assuming t is a DOM element  you could bypass the jQuery object creation   t cells 1  innerHTML

User · Answer

Try this      td eq 1      t     or     td     t   eq 1

User · Answer

It s surprising to see that nobody mentioned the native JS way to do this   Without jQuery  Just access the children property of the parent element  It will return a live HTMLCollection of children elements which can be accessed by an index  If you want to get the second child  parentElement children 1    In your case  something like this could work   example  var secondChild   document querySelector   parent   children 1    console log secondChild       lt td gt element two lt  td gt     lt table gt       lt tr class  quot parent quot  gt           lt td gt element one lt  td gt           lt td gt element two lt  td gt       lt  tr gt   lt  table gt   You can also use a combination of CSS3 selectors   querySelector   and utilize  nth-of-type    This method may work better in some cases  because you can also specifiy the element type  in this case td nth-of-type 2   example  var secondChild   document querySelector   parent  gt  td nth-of-type 2      console log secondChild       lt td gt element two lt  td gt

User · Answer

grab the second child    t  children   eq 1    or  grab the second child  lt td gt     t  children  td   eq 1    See documentation for children and eq

User · Answer

I didn t see it mentioned here  but you can also use CSS spec selectors  See the docs      parentContainer td nth-child 2

User · Answer

How s this     t  first   next       MAJOR UPDATE   Apart from how beautiful the answer looks  you must also give a thought to the performance of the code  Therefore  it is also relavant to know what exactly is in the   t  variable  Is it an array of  lt TD gt  or is it a  lt TR gt  node with several  lt TD gt s inside it  To further illustrate the point  see the jsPerf scores on a  lt ul gt  list with 50  lt li gt  children   http   jsperf com second-child-selector  The   t  first   next   method is the fastest here  by far   But  on the other hand  if you take the  lt tr gt  node and find the  lt td gt  children and and run the same test  the results won t be the same   Hope it helps

User · Answer

Here s a solution that maybe is clearer to read in code   To get the 2nd child of an unordered list         ul first-child   next     And a more elaborated example  This code gets the text of the  title  attribute of the 2nd child element of the UL identified as  my list          ul my list first-child   next   attr  title     In this second example  you can get rid of the  ul  at the start of the selector  as it s redundant  because an ID should be unique to a single page   It s there just to add clarity to the example   Note on Performance and Memory  these two examples are good performants  because they don t make jquery save a list of ul elements that had to be filtered afterwards

[jquery] Get second child using jQuery

Examples related to jquery

Examples related to jquery-selectors