drag/drop works

app.js

@@ -1,10 +1,23 @@
-const uls = document.querySelectorAll('ul');
+let currentDraggedItem = null;
 
+const uls = document.querySelectorAll('ul');
 for (ul of uls) {
 	ul.addEventListener('dragover', (event)=>{
+		event.preventDefault()
 		event.target.classList.add('dragging');
 	})
 	ul.addEventListener('dragleave', (event)=>{
 		event.target.classList.remove('dragging');
 	})
+	ul.addEventListener('drop', (event)=>{
+		event.target.classList.remove('dragging');
+		event.target.appendChild(currentDraggedItem)
+	})
+}
+
+const lis = document.querySelectorAll('li');
+for (li of lis) {
+	li.addEventListener('dragstart', (event)=>{
+		currentDraggedItem = event.target;
+	})
 }

index.html

@@ -14,21 +14,21 @@
 			<ul></ul>
 		</li>
 		<li draggable="true">
-			one
+			two
 			<ul></ul>
 		</li>
 		<li draggable="true">
-			one
+			three
 			<ul></ul>
 		</li>
 	</ul>
 	<ul>
 		<li draggable="true">
-			one
+			four
 			<ul></ul>
 		</li>
 		<li draggable="true">
-			one
+			five
 			<ul></ul>
 		</li>
 	</ul>