No funciona correctamente el next()

[Ciel]

1ero. Ahora que lo preguntas no estoy seguro, supongo que el textarea se usa mas para cuando se le puede ingresar contenido mas grande? O me equivoco? Aun asi uso un plugin para que se expanda el textarea para abajo al ir rellenando con texto el mismo, pero en fin...

2do. No uso directamente append() porque yo solamente te mostre el div "pro", pero tengo otro div con los mismos elementos dentro... entonces mi idea es hacerlo dinamicamente que al mandarle enter se cree un item <li> dentro del <ul> siguiente, se entiende?

3ro. Te paso el codigo:

Código Javascript:

$('textarea').keydown(function(event) {
        if(event.keyCode == 9) {
            if($(this).attr('id') == 'con') {
                $('#pro').focus();
                event.preventDefault();
            }
        }
        if(event.keyCode == 13) {
            if (!$.trim($(this).val())) {
                $(this).val("");
                return false;
            }
            var value = $(this).val();
            var item = "<li class='item'>" + value + "</li>";
            $(this).next('ul').append($(item).delay(1).animate({left: 0, opacity: 1}, 400));
            $(this).val("");
            
            var type = $(this).attr('id');
            listitems[type].push(value);
            
            if(created == 0) {
                $('#create-list').slideDown(300);
            }
            
            created++;
            event.preventDefault();
            return false;
        }
    });
 

Pero en fin, eso anda perfectamente.... el unico problema es el next() que no me saltea los elementos, por mas que le asigne un elemento como "ul". Es mas, antes me andaba... debe ser alguna boludez que cambie y esta afectando de alguna forma, pero no puedo entender que es.

EDIT: Si hago esto si funciona:

Código Javascript:

$(this).next().next('ul').append($(item).delay(1).animate({left: 0, opacity: 1}, 400));
 

Pero realmente no tiene sentido... como puede ser que no me saltee un div?