Отключить отсоединение в этом порядке, не добавляя

Question

Чтобы эффективно выполнять манипуляции с DOM, я отсоединяю элемент. В процессе, я наткнулся на эту интересную ситуацию:

jsFiddle Demo

<div id="d">a</div> 

var $holder = $("#d"); 
var $wrapper = $("<div>").css("border","1px solid red"); 
$holder.wrap($wrapper); 
$holder.detach(); 
$wrapper.append($holder); 

при котором ДИВ с буквой «а» в ней обернут DIV с красной каймой. Затем div с буквой «a» отделяется. Затем обертывание div добавляет отдельный «a». Однако буква «а» никогда не появляется.

Что я пропустил? Что я сделал не так? Как я могу вернуть «а»?

Answer 1

wrap() создает HTML-структуру на лету и вставляет его в DOM, поэтому что-то вроде:

$(element).wrap('<div><span></span></div>') 

работ, поэтому переменная $ wrapper не совпадает с элементом, который был фактически создан и вставлен в wrap(), поэтому вы снова получите элемент из DOM:

var $holder = $("#d"); 
var $wrapper = $('<div />', {style:'border:1px solid red;', id:'wrapper'}); 
$holder.wrap($wrapper); 
$holder.detach(); 
$('#wrapper').append($holder); 

FIDDLE

из documentation:

.wrap() может принимать любую строку или объект, который может быть передан функции фабрики $(), чтобы указать DOM состав. Эта структура может быть вложенной на несколько уровней в глубину, но должна содержать только один из самых лучших элементов. Копия этой структуры будет обернута вокруг каждого из элементов в наборе согласованных элементов. Этот метод возвращает исходный набор элементов для цепочки.

Answer 2

Вобще $holder.detach($wrapper);

редактировать: вот рабочий Fiddle