jQuery problème: le déplacement d'un d'un au début d'une autre

Question

J'ai deux ELU, un sur l'autre:

<ul id="one">
  <li>
  <li>
<ul>
<div id="div_for_second_UL">
  <ul>
   <li>
  </ul>
</div>

Dans la première, chaque LI a un bouton qui, lorsque vous cliquez dessus, supprime la LI et les bosses les ci-dessous LIs jusqu'à un espace pour combler le vide. Ça fonctionne bien. Mais je veux que le LI clique à ajouter en même temps au sommet de la prochaine UL, afin qu'il devienne le premier élément dans la liste du bas. En ce moment, je suis en train avec ce:

        li.fadeOut(500, function() {$(li).remove(); });
        li.insertBefore('#div_for_second_UL');

J'ai aussi essayé d'utiliser Préfixepour au lieu de insertBefore. Et je l'ai essayé d'ajouter un identifiant à la deuxième UL et l'utiliser comme argument dans insertBefore. Le résultat de chacun est le même:

-La LI disparaît et est remplacé par le même contenu, mais sans style -le nouveau contenu s'estompe, sans doute parce que l'effet de fadeOut n'a pas fini.

Où ai-je passé?

Merci ...

Answer 1

Essayez ceci:

li.fadeOut(500, function() {
     li.prependTo('#div_for_second_UL ul').fadeIn(); 
});

http://jsfiddle.net/Nf84m/1/

Answer 2

Oui. puisque vous ne l'avez pas cloner l'élément est retiré lorsque l'animation se termine. Vous devez effectuer la précédez dans le rappel d'animation pour garder cette synchrone d'action.

Essayez ceci:

li.fadeOut(500, function() {li.prependTo('#div_for_second_ul ul');});