jQuery在多個元素中的操作

Question

我有多個部分......在這些部分中有很少的子元素......我需要操作，以便每個部分移動1個元素，例如在另一個元素之後， H1

我嘗試在這裏http://jsfiddle.net/shavindra/LDpwq/1/但問題是它不是在年底通過循環和打印好..但我想，如下圖所示的輸出是不同的......

初始狀態：

<section class="greeting"> 
    <h2>Greetings 1</h2> 
    <div class="time">Morning</div> 
    <div class="inner">Good 1</div> 
</section> 

<br /> 
<br /> 

<section class="greeting"> 
    <h2>Greetings 1</h2> 
    <div class="time">Afternoon</div> 
    <div class="inner">Good 2</div> 
</section> 

<br /> 
<br /> 

<section class="greeting"> 
    <h2>Greetings 1</h2> 
    <div class="time">night</div> 
    <div class="inner">Good 3</div> 
</section> 

操作後

<section class="greeting"> 
    <h2>Greetings 1</h2> 
    <div class="inner">Good 1</div> 
    <div class="time">Morning</div> 
</section> 

<br /> 
<br /> 

<section class="greeting"> 
    <h2>Greetings 1</h2> 
    <div class="inner">Good 2</div> 
    <div class="time">Afternoon</div> 
</section> 

<br /> 
<br /> 

<section class="greeting"> 
    <h2>Greetings 1</h2> 
    <div class="inner">Good 3</div> 
    <div class="time">night</div> 
</section> 

Answer 1

有兩個問題你的原始代碼：

$(".greeting").each(function() { 
    $(this).children('.time').addClass("on"); 
    $(this).children('.time').after($('.inner')); 
}); 

1）你選擇的所有元素與inner上課後移動：

$('.inner') 

這一翻譯，只使用一個在當前的div：使用after功能，偉馳在元件之後插入作爲參數傳遞內容

$(this).children('.inner') 

2） You're你稱之爲功能。另一方面，insertAfter以相反的方式操作。從jQuery doc：

隨着。經過（），則該方法前的選擇器表達式是 容器之後將內容插入。使用.insertAfter（）， 另一方面，內容在方法之前，或者作爲選擇器 表達式或作爲即時創建的標記，並且在 之後插入目標容器。

所以，你可以更改您的代碼如下：

$(".greeting").each(function() { 
    $(this).children('.time').addClass("on"); 
    $(this).children('.time').insertAfter($(this).children('.inner')); 
}); 

或本：

$(".greeting").each(function() { 
    $(this).children('.time').addClass("on"); 
    $(this).children('.inner').after($(this).children('.time')); 
}); 

Answer 2

試試這個：

$(".greeting").each(function() { 
    $(this).children('div:eq(0)').before($(this).children('div:eq(1)')); 
}); 

http://jsfiddle.net/LDpwq/15/

Answer 3

$(".time").each(function() { 
    $(this).before($(this).siblings('.inner')); 
});​ 

DEMO：http://jsfiddle.net/LDpwq/4/