don't use child index

2 years ago · f5cc765dd5
parent 1de6361d87
commit f5cc765dd5
2 changed files with 6 additions and 5 deletions
--- a/app.js
+++ b/app.js
@ -15,7 +15,7 @@ for(const element of lisAndBody){
 	element.addEventListener('drop', (event)=>{
 		event.stopPropagation()
 		event.target.classList.remove('dragging');
-		event.target.children[0].appendChild(currentDraggedItem)
+		event.target.querySelector('ul').appendChild(currentDraggedItem)
 	})
 }
@ -26,10 +26,10 @@ const deleteItem = (event)=>{
 const createNewItem = (event)=>{
 	const template = document.querySelector('template').content.children[0];
 	const newItem = template.cloneNode(true)
-	newItem.children[1].addEventListener('click',createNewItem); 
+	newItem.querySelector('.add').addEventListener('click',createNewItem); 
-	newItem.children[3].addEventListener('click',deleteItem);
+	newItem.querySelector('.delete').addEventListener('click',deleteItem);
 	if(event){
-		event.target.parentNode.children[0].appendChild(newItem)
+		event.target.parentNode.querySelector('ul').appendChild(newItem)
 	} else {
 		document.querySelector('ul').appendChild(newItem)
 	}
--- a/index.html
+++ b/index.html
@ -7,10 +7,11 @@
 	<script defer src="app.js"></script>
 </head>
 <body>
 	<h1>New Trello</h1>
 	<ul></ul>
 	<template>
 		<li draggable="true">
-			placeholder
+			<h2>placeholder</h2>
 			<ul></ul>
 			<button class="add">Add</button>
 			<button class="edit">Edit</button>