diff --git a/app.css b/app.css
index ffb186d..9bc9aeb 100644
--- a/app.css
+++ b/app.css
@@ -1,7 +1,7 @@
-ul.dragging {
-	border-color:red;
+ul {
+	padding:0;
 }
-ul, li {
+li {
 	padding:1em;
 	border:1px solid black;
 	margin:1em;
@@ -12,8 +12,9 @@ li {
 	list-style:none;
 }
 
-li:active {
+li.dragging {
 	cursor:grabbing;
 	border-color:red;
+	border-color:red;
 	color:red;
 }
diff --git a/app.js b/app.js
index 70dab97..1845365 100644
--- a/app.js
+++ b/app.js
@@ -1,23 +1,21 @@
 let currentDraggedItem = null;
 
-const uls = document.querySelectorAll('ul');
-for (ul of uls) {
-	ul.addEventListener('dragover', (event)=>{
+const lis = document.querySelectorAll('li');
+for (li of lis) {
+	li.addEventListener('dragstart', (event)=>{
+		currentDraggedItem = event.target;
+		event.target.classList.add('dragging');
+	})
+	li.addEventListener('dragover', (event)=>{
 		event.preventDefault()
+		event.stopPropagation()
 		event.target.classList.add('dragging');
 	})
-	ul.addEventListener('dragleave', (event)=>{
+	li.addEventListener('dragleave', (event)=>{
 		event.target.classList.remove('dragging');
 	})
-	ul.addEventListener('drop', (event)=>{
+	li.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;
+		event.target.children[0].appendChild(currentDraggedItem)
 	})
 }