Изменить HTML позицию с JQuery

Question

Я пытаюсь изменить положение какого-либо списка с JQuery в функцию массива

http://jsfiddle.net/6r5jp5Lk/9/

$('div').each(function() { 
    var answer = JSON.parse('[' + $(this).find('.order').val() + ']'), 
    list = $(this).find('ul');      

    $.each(answer, function(index, value) { 
     list.append($('li[data-order="' + value + '"]')); 
    }); 

}); 

Почему содержание добавляющим в два раза?

Answer 1

Я установил http://jsfiddle.net/6r5jp5Lk/15/

$('.list').each(function() { 
    var answer = $(this).find('.order').val().split(','), 
    list = $(this); 

    $.each(answer, function(index, value) { 
     list.append($('li[data-order="' + value + '"]', list)); 
    }); 

}); 

Answer 2

Измените дела до .list и она отлично работает

$('.list').each(function() { 
    var answer = JSON.parse('[' + $(this).find('.order').val() + ']'), 
     list = $(this).find('ul');      

     $.each(answer, function(index, value) { 
      list.append($('li[data-order="' + value + '"]')); 
     }); 

}); 

Answer 3

Вы не закрываете тег Div, проверив у вас есть 4 DIV-тегов. Проверьте обновленный jsfiddle.

<div> 
 
<ul class="list"> 
 
    <li data-order="1">1</li> 
 
    <li data-order="2">2</li> 
 
    <li data-order="3">3</li> 
 
    <li data-order="4">4</li> 
 
    <input class="order" type="hidden" value="4,2,1,3" /> 
 
</ul> 
 
</div> 
 
    
 
<div> 
 
<ul class="list"> 
 
    <li data-order="1">1</li> 
 
    <li data-order="2">2</li> 
 
    <li data-order="3">3</li> 
 
    <li data-order="4">4</li> 
 
    <input class="order" type="hidden" value="3,2,4,1" /> 
 
</ul> 
 
</div> 
 

 

http://jsfiddle.net/6r5jp5Lk/16/