как обернуть существующий, но неизвестный элемент

Question

У меня есть сценарий, который я даю клиентам. Клиент может поместить его куда угодно в свой html-элемент. Он может быть помещен между div, td, p или что-либо подобное.

Скрипт выглядит примерно так:

<script id="myExample" src="http://www.mydomain.com/example.js" ></script> 

Теперь, в «example.js» Я хочу, чтобы обернуть мой сценарий динамически.

Я пытался что-то вроде:

// create the container div 
$("#myExample").wrap('<div></div>'); 
document.getElementById("myExample").firstChild.setAttribute("id","myExampleContainer"); 

... но я получаю сообщение об ошибке:

TypeError: document.getElementById(...).firstChild is null 

Может обертывание настоящий элемент (который является JS) с DIV и давая обертке идентификатор?

ОБНОВЛЕНИЕ: см. Ответ Мусы, внизу.

Два рабочих растворов:

// create the container div 
$("#myExample").wrap('<div></div>'); 
document.getElementById("myExample").parentNode.setAttribute("id","myExampleContainer"); 

... или:

$("#myExample").wrap('<div id="myExampleContainer"></div>'); 

Answer 1

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

document.getElementById("myExample").parentNode.setAttribute("id","myExampleContainer"); 

http://jsfiddle.net/awz8U/1/
или просто добавить идентификатор в DIV

$("#myExample").wrap('<div id="myExampleContainer"></div>'); 

http://jsfiddle.net/awz8U/2/

Answer 2

Должно быть childNodes вместо firstChild:

document.getElementById("myExample").childNodes[ 0 ].setAttribute... 

Но не забудьте проверить, если родитель имеет дочерние узлы:

if(document.getElementById("myExample") && document.getElementById("myExample").childNodes.length) { 
    // some stuff here... 
} 

Answer 3

$("myExample").wrap($("<div/>", { id: "myExampleContainer" }));