Last unknown element in known div with jquery

Question

How do you select the last child element in a known div where the child element is an unknown element. i.e: the element can be a paragraph or un-ordered list.

Most occasions the structure will be:

<div id="container">
<p>Text</p>
</div>

but on other occasions, the structure will be:

<div id="container">
<p>Text</p>
<ul>
<li>More Text</li>
</ul>
</div>

Answer 1

You can use .last()

$('#container').children().last().show();

Answer 2

You can use :last-child on its own without a type selector, like so:

$('#container > :last-child')

This is equivalent to specifying the * selector in place of a type selector (the * is optional and implied in this case, but you can put it in if it makes the code clearer to you):

$('#container > *:last-child')

This will get you the very last child regardless of what type of element it is. In your first structure, it's the p, and in the second structure, it's the ul (its li child is not included).

This is a valid CSS selector as well, so you can also use it in a stylesheet should you desire.

Answer 3

http://api.jquery.com/last/

Use jQuerys last method on all div's children.

Answer 4

Use :last Selector

Try This

$('#container > :last')