lesson 12

ZaDivan · ZaDivan · commit 4d5ab12e148e · 2021-03-09T16:28:01.000+02:00
diff --git a/app.js b/app.js
@@ -1,14 +1,32 @@
+const list = document.querySelector('#book-list ul');
 const forms = document.forms;
-console.log(forms);
-console.log(forms['add-book']);
 
-Array.from(forms).forEach(function(form){
-  console.log(form);
+// delete books
+list.addEventListener('click', (e) => {
+  if(e.target.className == 'delete'){
+    const li = e.target.parentElement;
+    li.parentNode.removeChild(li);
+  }
 });
 
+// add books
 const addForm = forms['add-book'];
 addForm.addEventListener('submit', function(e){
   e.preventDefault();
+
+  // create elements
   const value = addForm.querySelector('input[type="text"]').value;
-  console.log(value);
+  const li = document.createElement('li');
+  const bookName = document.createElement('span');
+  const deleteBtn = document.createElement('span');
+
+  // add text content
+  bookName.textContent = value;
+  deleteBtn.textContent = 'delete';
+
+  // append to DOM
+  li.appendChild(bookName);
+  li.appendChild(deleteBtn);
+  list.appendChild(li);
+  //list.insertBefore(li, list.querySelector('li:first-child'));
 });
