View Full Version : jQuery dynamic divs and Jquery

10-18-2010, 03: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:

<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' />";




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


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

10-19-2010, 04:56 AM
It's probably the age-old problem where the jQuery events do not know about the new divs. You should use the event .live() in your code, to make sure your jQuery events will apply to elements created in the future.

Read this for the gritty detail: