1 00:00:01,398 --> 00:00:04,506 Inserting elements is nice and good to know, 2 00:00:04,506 --> 00:00:05,650 but of course, 3 00:00:05,650 --> 00:00:10,560 sometimes you want to remove elements and how do you remove 4 00:00:10,560 --> 00:00:11,528 elements now? 5 00:00:11,528 --> 00:00:16,253 Well, for dis you will have only two steps that you need to 6 00:00:16,253 --> 00:00:17,514 execute. 7 00:00:17,514 --> 00:00:22,514 You need to select the element that should be removed, 8 00:00:25,080 --> 00:00:27,873 and then you need to remove it. 9 00:00:28,820 --> 00:00:30,710 So let's see how that works. 10 00:00:30,710 --> 00:00:31,543 Now, of course, 11 00:00:31,543 --> 00:00:35,160 we do know how selecting an element of works and therefore 12 00:00:35,160 --> 00:00:39,904 let's say we want to remove this H one element for this to 13 00:00:39,904 --> 00:00:43,915 remove it. We first of all, need to select it. 14 00:00:43,915 --> 00:00:48,915 And here all, just add a new variable first age, 15 00:00:49,270 --> 00:00:50,653 one element, 16 00:00:50,653 --> 00:00:55,653 and I can now get access to it by using document query 17 00:00:56,440 --> 00:00:57,988 selector H one, 18 00:00:57,988 --> 00:01:01,080 which will select me the first H one element. 19 00:01:01,080 --> 00:01:06,080 It finds on the page, which is also our only H one element. 20 00:01:06,620 --> 00:01:09,899 Alternatively I could of course have selected it by its ID. 21 00:01:09,899 --> 00:01:11,543 That would be fine too. 22 00:01:11,543 --> 00:01:14,239 Now, did we do have it selected? 23 00:01:14,239 --> 00:01:19,239 We can remove it by simply using first H one element and 24 00:01:20,430 --> 00:01:24,430 then calling the remove method on it. 25 00:01:24,430 --> 00:01:25,723 And this method, 26 00:01:27,186 --> 00:01:30,890 if called on an object on an HTML element object does just 27 00:01:30,890 --> 00:01:34,963 what the name implies. It removes that object. 28 00:01:36,770 --> 00:01:41,770 So if I saved that and I go back, this element is gone. 29 00:01:41,770 --> 00:01:46,578 The H one element is gone and we can no longer see it there. 30 00:01:46,578 --> 00:01:49,430 And alternative way of removing. 31 00:01:49,430 --> 00:01:54,430 It would be to select its parent element. 32 00:01:54,606 --> 00:01:56,271 So the body in this case, 33 00:01:56,271 --> 00:02:01,003 and calling remove child on that element, 34 00:02:01,003 --> 00:02:02,458 so on that body now, 35 00:02:02,458 --> 00:02:05,780 and then pass that child that should be removed. 36 00:02:05,780 --> 00:02:08,002 So the first age, one element to it, 37 00:02:08,919 --> 00:02:12,600 this is way longer and more complex than doing it like this. 38 00:02:12,600 --> 00:02:16,440 But I am mentioning it because this approach here using 39 00:02:16,440 --> 00:02:19,700 remove does not work in older browsers, 40 00:02:19,700 --> 00:02:22,940 like old versions of the internet Explorer. 41 00:02:22,940 --> 00:02:23,773 And hence, 42 00:02:23,773 --> 00:02:26,440 if you're building a website that should also work on those 43 00:02:26,440 --> 00:02:27,420 super old browsers, 44 00:02:27,420 --> 00:02:30,933 then this is a safer way of removing an element, 45 00:02:30,933 --> 00:02:35,574 which will be supported on such older browsers as well. 46 00:02:35,574 --> 00:02:37,880 So this is for older browsers. 47 00:02:37,880 --> 00:02:42,310 Of course, if you're targeting modern browsers, 48 00:02:42,310 --> 00:02:45,590 then using the shorter approach is better because it's 49 00:02:45,590 --> 00:02:49,440 shorter and you can see removing elements is really 50 00:02:49,440 --> 00:02:52,520 straightforward and not difficult. 51 00:02:52,520 --> 00:02:53,353 Now here, 52 00:02:53,353 --> 00:02:56,520 I'm getting an error because I'm trying to basically remove 53 00:02:56,520 --> 00:02:59,770 a child that I did already remove before. 54 00:02:59,770 --> 00:03:02,810 If I comment this out though, then dissolved. 55 00:03:02,810 --> 00:03:03,643 So were X, 56 00:03:04,513 --> 00:03:08,290 I got rid of the error and the H one element is deleted. 57 00:03:08,290 --> 00:03:11,683 So this approach also works. You can use either of the two.