diff --git a/src/pages/content/index.tsx b/src/pages/content/index.tsx
index 66a62b9e..5eaf3fe1 100644
--- a/src/pages/content/index.tsx
+++ b/src/pages/content/index.tsx
@@ -11,7 +11,7 @@ import adjustVolumeOnScrollWheel from "@/src/features/scrollWheelVolumeControl";
 import { setupVideoHistory, promptUserToResumeVideo } from "@/src/features/videoHistory";
 import volumeBoost from "@/src/features/volumeBoost";
 import { removeRemainingTimeDisplay, setupRemainingTime } from "@/src/features/remainingTime";
-import { addLoopButton } from "@/src/features/loopButton";
+import { addLoopButton, removeLoopButton } from "@/src/features/loopButton";
 // TODO: Add always show progressbar feature
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -194,13 +194,9 @@ window.onload = function () {
 					data: { loopButtonEnabled }
 				} = message;
 				if (loopButtonEnabled) {
-					const loopButton = document.querySelector("button.yte-loop-button") as HTMLButtonElement | null;
-					if (!loopButton) return;
-					loopButton.style.display = "block";
+					addLoopButton();
 				} else {
-					const loopButton = document.querySelector("button.yte-loop-button") as HTMLButtonElement | null;
-					if (!loopButton) return;
-					loopButton.style.display = "none";
+					removeLoopButton();
 				}
 				break;
 			}