Переместите div внутри другого div, используя jQuery - повторяющаяся последовательность

Question

У меня есть форма, в которой есть div, загруженные в метку заказа, поле, метку, поле, метку, поле и т. Д. c

Мне нужно переместить каждую метку внутри div 'field', который следует сразу за это оставляет меня с шаблоном div поля, поля, поля, поля и т. д. c ..

Код показывает метку div с классом .cf-label и поле с классом. cf-field '

<div class="cf-label">...</div>
<div class="cf-field">...</div>
<div class="cf-label">...</div>
<div class="cf-field">...</div>
<div class="cf-label">...</div>
<div class="cf-field">...</div>
<div class="cf-label">...</div>
<div class="cf-field">...</div>

Можно ли это сделать с помощью jQuery?

ОБНОВЛЕНИЕ

Таким образом, код, предоставленный Мамуном, работал, но некоторые типы полей (Caldera формы для Wordpress) встроенные сценарии, и поэтому я получаю следующий шаблон, который нарушает исходный код в точке, где в разметке находится первый тег сценария.

<div class="cf-label">...</div>
<script type="text/javascript">...</script>
<div class="cf-field">...</div>
<div class="cf-label">...</div>
<script type="text/javascript">...</script>
<div class="cf-field">...</div>
<div class="cf-label">...</div>
<script type="text/javascript">...</script>
<div class="cf-field">...</div>
<div class="cf-label">...</div>
<script type="text/javascript">...</script>
<div class="cf-field">...</div>

Как я могу переместить элементы <script/> на дно контейнера и таким образом «сохранить» шаблон метки / поля по всей форме?

Answer 1

Вы можете попробовать с .each() до l oop через все элементы метки

и .prependTo(), которые

Вставьте каждый элемент в наборе соответствующих элементов в начало цели.

Демонстрация:

$('.cf-label').each(function(){
  $(this).prependTo($(this).next('div.cf-field'));
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label class="cf-label">Label 1</label>
<div class="cf-field">Div 1<div>
<label class="cf-label">Label 2</label>
<div class="cf-field">Div 2<div>
<label class="cf-label">Label 3</label>
<div class="cf-field">Div 3<div>