How To Move An Element Into Another Element Using Jquery




Here we consider how to Move An Element Into Another Element. We can do this using Jquery. In Jquery, we will be using Jquery AppendTo and PrependTo for this purpose. Lets start with one example here.




appendTo adds the new element to the end of the destination element. Suppose we have a div with ID ParentDiv. And we have another separate Div with ID ChildDiv.

Move An Element Into Another Element Using Jquery, Move An Element Into Another Element, Add An Element Into Another Element In Jquery, Attach An Element Into Another Element Using Jquery AppendTo PrependTo, Difference between Jquery AppendTo And PrependTo, Jquery

We wants to place the ChildDiv inside ParentDiv. This can be done by using Jquery AppendTo as follows.

$(function () {
         $('#btnSubmit').click(function () {
                  $("#ChildDiv").appendTo("#ParentDiv");
         })
})






prependTo adds the new element to the beginning of the destination element. The above case can be done using Jquery PrependTo as follows.

$(function () {
         $('#btnSubmit').click(function () {
                  $("#ChildDiv").prependTo("#ParentDiv");
         })
})