Как клонировать объект jQuery и его дочерние элементы без ссылок в IE11

Question

Я пытаюсь клонировать объект jQuery, его дочерние элементы и никаких ссылок. Я понимаю, что clone() должен выполнить это, но в IE11 второй раз я пытаюсь добавить один из дочерних объектов в пустой окружный div, этот дочерний объект больше не существует. Вы можете увидеть это, дважды щелкнув «кликнуть меня» в своем фрагменте, используя IE11.

Я думаю, что моя проблема может заключаться в том, что ссылки на ребенка были клонированы, поэтому пустой div переписывал их, но может быть и неправильным. До сих пор clone() работал лучше всего для клонирования родительского элемента. Я предпочитаю использовать jQuery, а не getElementsByClassName. Мне не повезло с использованием $.extend(true, {}, $('.allItems'));

Буду признателен за любую помощь!

window.$allItems = $('.carousel_item').clone(); 
 

 
$('.link').on('click', function(evt) { 
 
    evt.preventDefault(); 
 
    
 
    $('.blue').html('').append('<div id="bills"></div>'); 
 
    $('#bills').append($allItems[0]); 
 
});

.blue { 
 
    background-color: #d0e4f2; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<a href="#" class="link">clickme</a> 
 
<div class="blue"> 
 
    <div id="bills"> 
 
    <div class='carousel_item'> 
 
     <img src='http://fillmurray.com/150/200'> 
 
     <div> 
 
     <span>Tomatoes</span> 
 
     </div> 
 
    </div> 
 
    <div class='carousel_item'> 
 
     <img src='http://fillmurray.com/200/200'> 
 
     <div> 
 
     <span>Film</span> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div>

Answer 1

решаемые это.

Чтобы добавить элемент карусели более одного раза после добавления пустого div, мне нужно было клонировать элементы DOM каждый раз, когда вызывалась функция. Мне нужно добавить одну строку в храповой слушателя:

$allItems = $allItems.clone();