0

I'm working with some HTML content inside <div id="content-text"> which (unfortunately) doesn't have any ids or classes in it's sub elements. Like...

<div id="content-text">
  <p>
    <ol>
      <li>first thing</li>
      <li>second thing</li>
    </ol>
  </p>
  etc......
</div>

I need to be able to select the HTML from elements like "the 3rd <p> tag" or "the 5th <li> tag" within the <div id="content-text"> using jQuery. I've tried things like $("#content-text").children("p:eq(5)").eq(4).html();, but I keep getting a result of null.

Any help is appreciated. Thanks!

gtilflm
  • 1,389
  • 1
  • 21
  • 51

1 Answers1

0

Try using :nth-of-type:

$('#content-text > p:nth-of-type(5)') // fifth p that is a direct child of #content-text
$('#content-text li:nth-of-type(3)') // third li, not direct child
Yury Fedorov
  • 14,508
  • 6
  • 50
  • 66
  • This is strange. When I use `$("#content-text p:nth-of-type(4)").html();`, I'm getting the 4th `

    ` of a `

    ` in the `
    `. But when I use `$("#content-text p:nth-of-type(3)").html();`, the proper `

    ` is selected. Thoughts?

     – gtilflm Aug 06 '16 at 18:28