1
00:00:00,120 --> 00:00:05,940
In the previous lesson, we saw how we can remove an item from our list by pressing delete, and what

2
00:00:05,940 --> 00:00:11,400
we're doing is we're just rebuilding the list and because we're rebuilding the list every time, it's

3
00:00:11,400 --> 00:00:14,990
based on the array, which is contained within my list.

4
00:00:15,210 --> 00:00:21,690
So if we add something and if we want to add something, it's as easy as updating our array and then

5
00:00:21,690 --> 00:00:23,090
launching build again.

6
00:00:23,340 --> 00:00:26,040
So we want to push an item to our list.

7
00:00:26,310 --> 00:00:30,890
We can select the contents that's contained within the ADD item variable.

8
00:00:31,620 --> 00:00:35,310
So taking another value, we're going to select that object.

9
00:00:35,580 --> 00:00:41,520
And this is going to be our new item and selecting using query selector, we're going to select the

10
00:00:41,520 --> 00:00:48,050
element with add item as the value and then we just need to get the value from that input.

11
00:00:48,300 --> 00:00:51,780
So we'll check to see if that one has a value.

12
00:00:52,590 --> 00:00:55,950
And if it does, then we're going to add it into our list.

13
00:00:56,460 --> 00:01:00,930
And if it doesn't, then we're not going to do anything because we don't want to add any blank values

14
00:01:00,930 --> 00:01:01,340
in there.

15
00:01:01,770 --> 00:01:02,550
So let's try that.

16
00:01:02,560 --> 00:01:04,470
It's and now we do add item.

17
00:01:04,800 --> 00:01:06,110
We all we get is clicked.

18
00:01:06,120 --> 00:01:09,390
If we do test, we're adding it into our list.

19
00:01:09,600 --> 00:01:12,450
And then lastly, we still need to rebuild our list.

20
00:01:13,500 --> 00:01:18,470
So whenever we push content into our array, we want to rebuild our list.

21
00:01:18,660 --> 00:01:24,600
So if I do test, you see test gets added in there and it's got the same functionality that we had earlier.

22
00:01:24,960 --> 00:01:26,190
So we've got the delete.

23
00:01:26,220 --> 00:01:28,320
We can add as many of them as we want.

24
00:01:28,710 --> 00:01:35,010
And then of course, we can delete as many as we want as well as again, we're just simply rebuilding

25
00:01:35,010 --> 00:01:35,760
that array.

26
00:01:35,910 --> 00:01:41,500
So whatever contents are in the array is what's going to get output when we launched the function build.

27
00:01:42,000 --> 00:01:46,380
So the next thing that we want to do and the last thing that we want to do is have the ability to edit

28
00:01:46,380 --> 00:01:50,700
that content so well, if you got something in the list, you don't want to delete it.

29
00:01:50,700 --> 00:01:53,580
You don't want to add a new item, you want to edit it.

30
00:01:53,580 --> 00:01:56,790
So it's going to be a little bit trickier, but still possible.

31
00:01:56,910 --> 00:02:02,430
And we're going to do it cut the same way as we did with the event listener that we added into the span

32
00:02:02,430 --> 00:02:03,660
as we're creating them.

33
00:02:03,900 --> 00:02:06,690
Except this time we need to have the ability to edit it.

34
00:02:07,020 --> 00:02:08,700
So that's coming up in the next lesson.