Переместите элемент в другой родительский объект после изменения его идентификатора

У меня есть такой HTML:

<span class="file-wrapper" id="fileSpan">
    <input type="file" name="photo[]" id="photo" />
    <span class="button">Click to choose photo</span>
</span>

Я хочу извлечь из него поле ввода, изменить его ID и поместить его в другой div.

Как я могу это сделать? Если jQuery необходим, чтобы это было хорошо, но если бы это было возможно, это было бы здорово.

ОТВЕТЫ

Ответ 1

В jQuery, конечно, легко:

// jQuery 1.6+
$("#photo").prop("id", "newId").appendTo("#someOtherDiv");

// jQuery (all versions)
$("#photo").attr("id", "newId").appendTo("#someOtherDiv");

Рабочая демонстрация: http://jsfiddle.net/AndyE/a93Az/

<ч/" > Если вы хотите сделать это в простой версии JS, все еще довольно просто:

var photo = document.getElementById("photo");
photo.id  = "newId";
document.getElementById("someOtherDiv").appendChild(photo);

Рабочая демонстрация: http://jsfiddle.net/AndyE/a93Az/1/