JakAttk123 JakAttk123 - 4 months ago 10
jQuery Question

jQuery .last().hide().fadeIn() fading in all items in the list

$('#mainlist').last().hide().fadeIn(200);


Why is this hiding, and then fading in all the items in the list instead of just the last one?

Edit: The section of HTML:

<div id="mainbox">
<ul id = "mainlist">

</ul>
</div>


My js appends to the ul with a li, and then it runs the first code shown above.

Answer

It's because there's only one element in the list returned by $("#mainlist"). You're selecting the last #mainlist which is your ul.

The .last() method selects the last element in a list of DOM elements, not the last child of the elements selected.

From the jQuery docs:

Given a jQuery object that represents a set of DOM elements, the .last() method constructs a new jQuery object from the last element in that set.

You want something like $('#mainlist li').last().hide().fadeIn(200); instead.