diff --git a/frontend/www/exercise.html b/frontend/www/exercise.html
index 439cda86808120a3438c9136e491dd3f4d6cc7b6..7fc60ce37a0597f08045499d53f6a4f5e5424c2a 100644
--- a/frontend/www/exercise.html
+++ b/frontend/www/exercise.html
@@ -51,7 +51,7 @@
             </div>
         </div>
             <table id="leaderboardstable" class="table table-striped">
-                <tr><th>Rank<th>Username<th>Score
+                <tr><th scope="col">Rank<th scope="col">Username<th scope="col">Score
             </table>
           </div>
         <script src="scripts/defaults.js"></script>
diff --git a/frontend/www/scripts/exercise.js b/frontend/www/scripts/exercise.js
index 05dfbbc397115c4d725d38124053c897aa4332f5..a4e321e8404a33c16d341c5a695a8277a8837537 100644
--- a/frontend/www/scripts/exercise.js
+++ b/frontend/www/scripts/exercise.js
@@ -3,6 +3,8 @@ let okButton;
 let deleteButton;
 let editButton;
 let oldFormData;
+let leaderboardTable;
+let leaderboardTitle;
 
 function handleCancelButtonDuringEdit() {
   setReadOnly(true, "#form-exercise");
@@ -127,7 +129,6 @@ async function updateExercise(id) {
 
 async function fetchLeaderBoards(id) {
 
-  // Fetches leaderboard data
   let response = await sendRequest("GET", `${HOST}/api/leaderboards/${id}/`);
   let data = await response.json();
 
diff --git a/frontend/www/scripts/workouts.js b/frontend/www/scripts/workouts.js
index 1d8ecc639dcb3da15a3efd9ab301caf7b0a560d8..1b3610a046f0fb46bf3fa4ce967457e894fc4785 100644
--- a/frontend/www/scripts/workouts.js
+++ b/frontend/www/scripts/workouts.js
@@ -7,67 +7,76 @@ async function fetchWorkouts(ordering) {
         let data = await response.json();
 
         let workouts = data.results;
-        let container = document.getElementById('div-content');
+        
+        await convertWorkoutDataToFrontend(workouts);
 
-        for(const workout of workouts){
+        return workouts;
+    }
+}
 
-            let workoutLikes = await sendRequest("GET", `${HOST}/api/workoutLiking/${workout.id}`);
+async function convertWorkoutDataToFrontend(workouts){
+    let container = document.getElementById('div-content');
 
-            let workoutLikesData = [true, 1]
+    for(const workout of workouts){
 
-            if(workoutLikes.ok){
-                workoutLikesData = await workoutLikes.json()
-            }
+        let workoutLikes = await sendRequest("GET", `${HOST}/api/workoutLiking/${workout.id}`);
 
-            let templateWorkout = document.querySelector("#template-workout");
-            let cloneWorkout = templateWorkout.content.cloneNode(true);
+        let workoutLikesData = [true, 1]
 
-            let aWorkout = cloneWorkout.querySelector("a");
-            aWorkout.href = `workout.html?id=${workout.id}`;
+        if(workoutLikes.ok){
+            workoutLikesData = await workoutLikes.json()
+        }
 
-            let h5 = aWorkout.querySelector("h5");
-            h5.textContent = workout.name;
+        let templateWorkout = document.querySelector("#template-workout");
+        let cloneWorkout = templateWorkout.content.cloneNode(true);
 
-            let localDate = new Date(workout.date);
+        let aWorkout = cloneWorkout.querySelector("a");
+        aWorkout.href = `workout.html?id=${workout.id}`;
 
-            let table = aWorkout.querySelector("table");
-            let rows = table.querySelectorAll("tr");
-            rows[0].querySelectorAll("td")[1].textContent = localDate.toLocaleDateString(); // Date
-            rows[1].querySelectorAll("td")[1].textContent = localDate.toLocaleTimeString(); // Time
-            rows[2].querySelectorAll("td")[1].textContent = workout.owner_username; //Owner
-            rows[3].querySelectorAll("td")[1].textContent = workout.exercise_instances.length; // Exercises
+        let h5 = aWorkout.querySelector("h5");
+        h5.textContent = workout.name;
 
-            rows[4].querySelectorAll("td")[1].textContent = workoutLikesData[1]
+        let localDate = new Date(workout.date);
 
-            let likeButton = rows[4].querySelectorAll("td")[2].querySelector(".like-button")
+        let table = aWorkout.querySelector("table");
+        let rows = table.querySelectorAll("tr");
+        rows[0].querySelectorAll("td")[1].textContent = localDate.toLocaleDateString(); // Date
+        rows[1].querySelectorAll("td")[1].textContent = localDate.toLocaleTimeString(); // Time
+        rows[2].querySelectorAll("td")[1].textContent = workout.owner_username; //Owner
+        rows[3].querySelectorAll("td")[1].textContent = workout.exercise_instances.length; // Exercises
 
-            if(!workoutLikesData[0]){
-                likeButton.classList.add("active")
-            }
+        rows[4].querySelectorAll("td")[1].textContent = workoutLikesData[1]
 
-            likeButton.addEventListener("click", async function(e) {
-                e.preventDefault();
+        let likeButton = rows[4].querySelectorAll("td")[2].querySelector(".like-button")
 
-                if(!this.classList.contains("active")){
-                    this.classList.add("active");
-                    this.classList.add("animated");
-                    generateClones(this);
+        if(!workoutLikesData[0]){
+            likeButton.classList.add("active")
+        }
 
-                    let likeWorkoutResponse = await sendRequest("POST", `${HOST}/api/workoutLiking/${workout.id}/`, {});
+        await addEventListenersForLikeButtons(workout, likeButton, rows);
 
-                    if(likeWorkoutResponse.ok){
-                        let likeWorkoutData = await likeWorkoutResponse.json()
-                        rows[4].querySelectorAll("td")[1].textContent = likeWorkoutData[1]
-                        likeButton.classList.add("active")
-                    }
-                }
-            })
+        container.appendChild(aWorkout);
+    }
+}
 
+async function addEventListenersForLikeButtons(workout, likeButton, rows){
+    likeButton.addEventListener("click", async function(e) {
+        e.preventDefault();
 
-            container.appendChild(aWorkout);
-        };
-        return workouts;
-    }
+        if(!this.classList.contains("active")){
+            this.classList.add("active");
+            this.classList.add("animated");
+            generateClones(this);
+
+            let likeWorkoutResponse = await sendRequest("POST", `${HOST}/api/workoutLiking/${workout.id}/`, {});
+
+            if(likeWorkoutResponse.ok){
+                let likeWorkoutData = await likeWorkoutResponse.json()
+                rows[4].querySelectorAll("td")[1].textContent = likeWorkoutData[1]
+                likeButton.classList.add("active")
+            }
+        }
+    })
 }
 
 function createWorkout() {
@@ -171,9 +180,6 @@ function generateClones(button) {
       clone.parentNode.removeChild(clone);
       clearTimeout(removeNodeTimeout);
     }, 900);
-    let removeClassTimeout = setTimeout( function() {
-      button.classList.remove("animated")
-    }, 600);
   }
 }