Make some change on how to the error display without interfere with the main heading

Jacknguyen4438 · Jacknguyen4438 · commit 0bae369bcea5 · 2026-04-23T12:52:24.000+01:00
diff --git a/Sprint-3/alarmclock/alarmclock.js b/Sprint-3/alarmclock/alarmclock.js
@@ -4,11 +4,10 @@ function resetAlarm() {
   clearInterval(countdown);
   countdown = null;
   pauseAlarm();
-  updateHeading(0);
 }
 
 function showError(message) {
-  const heading = document.getElementById("timeRemaining");
+  const heading = document.getElementById("errorMessage");
   heading.innerText = message;
 }
 
@@ -23,6 +22,8 @@ function setAlarm() {
     return;
   }
 
+  document.getElementById("errorMessage").innerText = "";
+
   if (time === 0) {
     updateHeading(0);
     playAlarm();
diff --git a/Sprint-3/alarmclock/index.html b/Sprint-3/alarmclock/index.html
@@ -9,6 +9,7 @@
   <body>
     <div class="centre">
       <h1 id="timeRemaining">Time Remaining: 00:00</h1>
+      <p id="errorMessage" style="color: red;"></p>
       <label for="alarmSet">Set time to:</label>
       <input id="alarmSet" type="number" />
 

Original file line number	Diff line number	Diff line change
`@@ -4,11 +4,10 @@ function resetAlarm() {`
`4`	`4`	`clearInterval(countdown);`
`5`	`5`	`countdown = null;`
`6`	`6`	`pauseAlarm();`
`7`		`- updateHeading(0);`
`8`	`7`	`}`
`9`	`8`
`10`	`9`	`function showError(message) {`
`11`		`- const heading = document.getElementById("timeRemaining");`
	`10`	`+ const heading = document.getElementById("errorMessage");`
`12`	`11`	`heading.innerText = message;`
`13`	`12`	`}`
`14`	`13`
`@@ -23,6 +22,8 @@ function setAlarm() {`
`23`	`22`	`return;`
`24`	`23`	`}`
`25`	`24`
	`25`	`+ document.getElementById("errorMessage").innerText = "";`
	`26`	`+`
`26`	`27`	`if (time === 0) {`
`27`	`28`	`updateHeading(0);`
`28`	`29`	`playAlarm();`