jQuery dynamic divs and Jquery [Archive]

Shuyinsan

10-18-2010, 02:12 PM

Hey people of Codingforum.

I've been lurking on here for an anwser but couldn't find a thread that could help me with this.

I have .html file which loads in 3 .js files

<script src="./main/js/jquery.js" type="text/javascript"></script>
<script src="./main/js/jquery.touch.js" type="text/javascript"></script>
<script src="./main/js/site.js" type="text/javascript"></script>

Jquery is needed for Jquery.touch (iphone/iPad library)
site.js is a definition for div id's to check if touchable (depends on jquery.touch)

Anyway if I manually add
<div id="touchme"><img class="largetouchbox" src="images/image.png"/></div>

Then this div will be draggable and resizable on the iPad. (site.js basically sais that any div with the id "touchme" is draggable, rotateable and resizeable)

But when I do this:

<head>
<script type="text/javascript" language="javascript">

function createDiv()
{
var divTag = document.createElement("div");
var div = document.getElementById("wrapper");

divTag.id = "touchme";

divTag.innerHTML = "<img class='largetouchbox' src='images/burger.png' />";

div.appendChild(divTag);
}

</script>
</head>

and

<body>
<p align="center">
<b>Click this button to create div element dynamically:</b>
<input id="btn1" type="button" value="create div" onclick="createDiv();" />
</p>

</body>

Then the button does add the div continuously, but the image is not draggable
it's like the newly added divs aren't getting any javascript/jquery code on them.

Is there a way to add this manually?

thanks in advance