jquery - 用jquery将子元素移动到最后一个位置的最干净的方法？

Question

这就是我目前的做法：

function switchcontent(wait){
    //fade out image1
    $('#feature-img img:first-child, ').delay(wait).fadeOut('slow', function() {
        //fade in imag2
        $('#feature-img img:nth-child(2)').fadeIn('slow');
        var prev_img = ($(this).clone())
        $('#feature-img').append(prev_img);
        $(this).remove()
        switchcontent(wait);
    });
};

我对这个解决方案不是很满意，特别是因为我也想将它应用于子元素的另一个元素。

当前的 HTML：

<div class="images span7">
  <img src="featured_1.png">
  <img src="featured_2.png">
</div>

我想要一些也适用于：

<div class="feature-text">
  <div>
    <h1>Lugn i din eknonomi</h1>
    <p>Zenconomy är smart fakturering, redovisning och rapportering på nätet. Vi underlättar vardagen för företagare, redovisningsbyråer och programmerare.</p>
  </div>
  <div>
    <h1>GRAPH</h1>
    <p>GRAPH OF APPROVAL!</p>
  </div>
</div>

或任何其他带有子元素的元素:)

Answer 1

见http://jsbin.com/ufahiy/1/edit

$('div img:first').appendTo('div');

这会将第一个元素移动为 div 的最后一个元素

无需克隆和删除它：append()您要移动的一个元素就足够了。您可以使用 firebug 检查 DOM 并查看更改

Answer 2

$('#feature-img').append(prev_img);
        $(this).remove()

你不需要克隆它来追加。直接附加它，它会被移动。

prev_img=$(this);
$('#feature-img').append(prv_img);