select first child with jquery

Question

I am trying to select first child of ul and then remove it and then append it in the end of that ul but unfortunately i can not selet first child.

Here is code

current = 0;
$(document).ready(function(){

    width=951;

    var totalSlides=$(".slider ul li").length;
    $(".slider ul").removeAttr('width');
    $(".slider ul").attr('width',width*totalSlides);

    $('#next img').click(function(){
        current -= width;
        $(".slider ul").animate({"left":current+"px"}, "slow");
        $(".slider ul").append($(".slider ul:first-child"));
        //$('.slider ul:firstChild').remove();
    });
});

Answer 1

You don't need to .remove()^help or .detach()^help a node to append it somewhere else. You can do it by just invoking .append()^help or .appendTo()^help respectively .after()^help and .insertAfter^help. For instance:

$('ul li:first').insertAfter('ul li:last');

Demo: http://www.jsfiddle.net/KFk4P/

Answer 2

Any of these will work:

• $('ul > li:first')
• $('ul > li:first-child')
• $('ul > li:eq(0)')
• $('ul > li:nth-child(1)')
• $('ul > li').eq(0)
• $('ul > li').first()
• $('ul > li')[0]