1
00:00:02,510 --> 00:00:07,260
So you learned that inserting an element more than once will move it and not copy it,

2
00:00:07,370 --> 00:00:12,590
if you would want to copy an element, well then you can do this with another method which is available

3
00:00:12,590 --> 00:00:15,320
on every DOM node object,

4
00:00:15,440 --> 00:00:22,880
so let's say on our new li with clone node this will clone this node and will really return a brand

5
00:00:22,940 --> 00:00:23,670
new one.

6
00:00:23,690 --> 00:00:28,840
It takes one optional argument and that's a boolean which can be true or false

7
00:00:28,850 --> 00:00:33,340
which by default is false, which simply determines whether a deep clone,

8
00:00:33,350 --> 00:00:38,030
so with all child and descendant elements should be done or not.

9
00:00:38,150 --> 00:00:43,550
If you pass false here, which is the default, then only the list item itself is cloned

10
00:00:43,550 --> 00:00:48,650
but no nested elements you might have in there. If you pass true here,

11
00:00:48,650 --> 00:00:55,400
then not only the direct child element but also all child elements of that element and all descendants

12
00:00:55,400 --> 00:00:57,740
in general will be part of the clone.

13
00:00:57,740 --> 00:01:04,760
So now if we do that and we have newLi2 where I store this clone, now I can of course go ahead to

14
00:01:04,760 --> 00:01:14,360
my list and let's say append new li and newLi2 and the result of that is of course that item

15
00:01:14,360 --> 00:01:20,390
4 is moved to the end because I appended new li which already was part but I also appended the brand

16
00:01:20,450 --> 00:01:24,230
new li 2 which is why I have another item 4 here

17
00:01:24,270 --> 00:01:25,660
added to the end.

18
00:01:25,820 --> 00:01:31,710
So this is how you can also copy elements if you need to instead of recreating and reconfiguring it,

19
00:01:31,730 --> 00:01:37,130
this might simply save you some time if you want to take most of the settings of an existing element

20
00:01:37,280 --> 00:01:43,190
or all of the settings and then just insert this brand new element into your DOM as well.