.before() стрельба несколько раз

Question

То, что я пытаюсь достичь: изменить порядок содержимого всех «строк» ​​-divs, поэтому содержимое изображения всегда находится перед текстовым контентом.

HTML:

<div class="row"> 
    <div class="image">image content here</div> 
    <div class="text">text content here</div> 
</div> 
<div class="row"> 
    <div class="text">text content here</div> 
    <div class="image">image content here</div> 
</div> 

Что это должно выглядеть потом:

<div class="row"> 
    <div class="image">image content here</div> 
    <div class="text">text content here</div> 
</div> 
<div class="row"> 
    <div class="image">image content here</div> 
    <div class="text">text content here</div> 
</div> 

Мой JQuery:

$('.row').each(function() { 
    firstChild = $(this).find(':first-child'); 
    if(firstChild.hasClass('text')) { 
     firstChild.before($(this).find('.image')); 
    } 
    else { 
     console.log("not text"); 
    } 
} 

JQuery помещает DIV изображения в странных заказов, после того, как долото кода Я вижу несколько изображений, размещенных на сайте. Помогите пожалуйста :)

Answer 1

Почему не только это

$(this).append(firstChild); 

вместо

firstChild.before($(this).find('.image')); 

кодекса

$('.row').each(function() { 
    var firstChild = $(this).find(':first-child'); 
    if(firstChild.hasClass('text')) { 
     $(this).append(firstChild); 
    } 
    else { 
     console.log("not text"); 
    } 
}); 

Check Fiddle