diff --git a/static/script.js b/static/script.js
index 8c5ea5a..36f2482 100644
--- a/static/script.js
+++ b/static/script.js
@@ -1,22 +1,32 @@
-//Ich möchte dafur sorgen das wenn der knopf auf der karte gedrückt wird diese gespielt wird
 const audios = document.querySelectorAll("audio")
 const articles = document.querySelectorAll("article")
-const signs = document.querySelectorAll(".sing")
 outindex = 0
 playing = false
 playcolor = "#00ff3c"
 loop = true
+
+function onplay(id){
+  id = parseInt(id)
+  if(id>0){
+    articles[id-1].style.filter = "grayscale("+(id+1)*50+"%)"
+    articles[id-1].style.boxShadow = "0 0 0px 0px "+playcolor
+  }
+    articles[id].style.filter = "grayscale(0%)"
+    articles[id].style.margin = "8px"
+    articles[id].style.boxShadow = "0 0 6px 1px "+playcolor
+}
+
 function nächste(id){
   audios[id].pause()
-  console.log(id)
   id = parseInt(id) + 1
-  console.log(id)
   audios[id].play()
 }
+
 function vorherige(id){
   audios[id].pause()
   audios[id-1].play()
 }
+
 function looptrue(){
   if(loop){
     loop = false
@@ -28,22 +38,26 @@ function looptrue(){
     document.querySelector("#loop").innerHTML = "Loop"
   }
 }
+
 function abspielendiese(id){
   if(playing){
+    //ON PAUSE
     audios[id].pause()
     playing = false
     articles[id].style.margin = "0px"
     articles[id].style.boxShadow = "0 0 0px 0px "+playcolor
   }
   else{
+    //ON PLAY
     audios[id].play()
     playing = true
-    articles[id].style.margin = "8px"
-    articles[id].style.boxShadow = "0 0 6px 3px "+playcolor
+    onplay(id)
   }
 }
+
 function abspielen(){
   if(playing){
+    //ON PAUSE
     audios[outindex].pause()
     playing = false
     articles[outindex].style.margin = "0px"
@@ -51,26 +65,23 @@ function abspielen(){
     document.querySelector("#play").innerHTML = "Abspielen"
   }
   else{
+    //ON PLAY
     audios[outindex].play()
     playing = true
-    articles[outindex].style.margin = "8px"
-    articles[outindex].style.boxShadow = "0 0 6px 3px "+playcolor
     document.querySelector("#play").innerHTML = "Pausieren"
+    onplay(outindex)
   }
 }
+
 for (const [index,audio] of audios.entries()){
   audio.addEventListener("ended", (event) => { 
   if (index != audios.length -1){
     outindex = index +1
     audios[outindex].play()
-    // Visueles
-    articles[index].style.filter = "grayscale("+(index+1)*50+"%)"
-    articles[index].style.boxShadow = "0 0 0px 0px "+playcolor
-    articles[outindex].style.filter = "grayscale(0%)"
-    articles[outindex].style.margin = "8px"
-    articles[outindex].style.boxShadow = "0 0 6px 1px "+playcolor
+    onplay(index)
   }
   else{
+    //Last song ON END
     articles[index].style.filter = "grayscale(80%)"
     articles[index].style.boxShadow = "0 0 0px 0px "+playcolor
     articles[index].style.margin = "8px"
@@ -80,5 +91,4 @@ for (const [index,audio] of audios.entries()){
     }
   }
   })
-}
-console.log(audios)
\ No newline at end of file
+}
\ No newline at end of file