Вставить существующий элемент только что созданный

Question

Если у меня есть: <span>Some Code Here</span>, могу ли я создать новый элемент div и переместить элемент span в только что созданный div?

Новый элемент должен быть в том же месте, где элемент span был до

Я бы хотел использовать чистый код JavaScript

Answer 1

HTML:

<span id="the_id">Some code...</span>    

JS:

var the_div = document.getElementById('the_id');
var foobar = document.createElement('div');
foobar.appendChild(the_id);
the_id.parentNode.replaceChild(foobar, the_id);

Answer 2

var wrapper = document.createElement('div');
var selected_span = document.getElementByTagName('span')[0]; //get the first available span element
span_clone = selected_span.cloneNode(true);
selected_span.parentNode.insertBefore(wrapper, selected_span);
selected_span.parentNode.removeChild(selected_span);
wrapper.appendChild(span_clone);

Это создает новое <div>, создает копию span, удаляет оригинал span и затем вставляет копию в div

jsFiddle

этот является тем же примером в контейнере

Answer 3

здесь:

http://jsbin.com/uyiluf/3

источник:

http://jsbin.com/uyiluf/3/edit#source