You have set .draggable to be called as soon as the document is ready, making any element with the id of 'myNewDiv' draggable. The problem is, you're not creating that element until you click on a link. See
http://docs.jquery.com/Frequently_Asked_Questions#Why_doesn.27t_an_event_work_on_a_new_element_I.27ve_created.3F One way to fix this is create the element and then immediately call .draggable on it, like so $('<div id="myNewDiv">test div its draggable</div>').appendTo("#insideParent"); $('#myNewDiv').Draggable(); // capital D draggable is Interface, jQuery UI would be lowercase d draggable Also, it looks like you're using the old Interface library, which is no longer supported. Have you tried jQuery UI? http://ui.jquery.com/ - Richard On Tue, Jan 6, 2009 at 6:10 PM, merihsaka...@yahoo.com < merihsaka...@yahoo.com> wrote: > > Hi all , > I have a poroblem with new created div.. draggable function is not > working. > > normally draggable div is working successfull like this code. > > <html> > <head> > <script src="js/dragYeni/jquery.js"></script> > <script type="text/javascript" src="js/iutil.js"></script> > <script type="text/javascript" src="js/idrag.js"></script> > </head> > > <body> > <div id="parentElem"> > <div id="insideParent"></div> > </div> > > <script type="text/javascript"> > jQuery(document).ready( > function() > { > jQuery('#insideParent').Draggable( > { > zIndex: 1000, > ghosting: false, > opacity: 0.7, > containment : 'parent' > } > ); > } > ); > </script> > </body> > </html> > > ------------------------- > > *** But the problem is starting when I create a new div.. > I can add a new div, there is no problem there.. but its not > draggable.. > > <html> > <head> > <script src="js/jquery.js"></script> > <script type="text/javascript" src="js/iutil.js"></script> > <script type="text/javascript" src="js/idrag.js"></script> > > <script> > function addEvent() { > var ni = document.getElementById('insideParent'); > var divIdName = "myNewDiv"; > var newdiv = document.createElement('div'); > newdiv.setAttribute("id",divIdName); > newdiv.innerHTML = "test div its draggable"; > ni.appendChild(newdiv); > } > </script> > > </head> > > <body> > > <a href="javascript:;" onclick="addEvent();" > add new div </a> > > > <div id="parentElem"> > <div id="insideParent"></div> > </div> > > <script type="text/javascript"> > jQuery(document).ready( > function() > { > jQuery('#myNewDiv).Draggable( > { > zIndex: 1000, > ghosting: false, > opacity: 0.7, > containment : 'parent' > } > ); > } > ); > </script> > </body> > </html> > > > I need help.. > > thanks alot..