diff --git a/1-exercise-solutions/lesson-12/12i.html b/1-exercise-solutions/lesson-12/12i.html
index 10e9d30..57f7ebc 100644
--- a/1-exercise-solutions/lesson-12/12i.html
+++ b/1-exercise-solutions/lesson-12/12i.html
@@ -1,70 +1,52 @@
 <!DOCTYPE html>
-<html>
-  <head>
-    <title>App</title>
-  </head>
-  <body>
-    <!--
-      Note: This is just a sample solution. Other
-      solutions are possible so don't worry if
-      your solution looks different.
-    -->
-    <button onclick="
-      messages++;
-      displayNotification();
-    ">Add</button>
 
-    <button onclick="
-      if (messages > 0) {
-        messages--;
-
-        // If there are no new messages, stop displaying
-        // the notification in the tab.
-        if (messages === 0) {
-          stopNotification();
-        }
-      }
-    ">Remove</button>
+<head>
+    <title>12I - App</title>
+</head>
 
+<body>
+    <button class="js-add-btn">Add</button>
+    <button class="js-remove-btn">Remove</button>
     <script>
-      let messages = 2;
-
-      // Save the intervalId in case we need to cancel it.
-      let intervalId;
-
-      // We'll use this variable to keep track of whether
-      // or not we're displaying the notification.
-      let isDisplayingNotification;
-
-      // Start displaying the notification in the tab
-      // when the page first loads.
-      displayNotification();
 
-      function displayNotification() {
-        // If we're already displaying the notification,
-        // stop this function because we don't want to
-        // create 2 intervals at the same time.
-        if (isDisplayingNotification) {
-          return;
+        let intervalId;
+        let number = 0;
+        let flag = false;
+
+        document.querySelector('.js-add-btn')
+            .addEventListener('click', () => {
+                number++;
+                blinking();
+            });
+        document.querySelector('.js-remove-btn')
+            .addEventListener('click', () => {
+                blinking();
+                if (number > 0) { number--; blinking(); }
+                if (number === 0) {
+                    clearInterval(intervalId);
+                    document.title = '12I - App';
+                    flag = false;
+                }
+            });
+
+        function blinking() {
+            if (!flag) {
+
+                clearInterval(intervalId);
+
+                intervalId = setInterval(function () {
+                    if (document.title === '12I - App') {
+                        document.title = `(${number}) New message`;
+                    } else {
+                        document.title = '12I - App';
+                    }
+                }, 1000);
+
+                flag = true;
+            }
         }
 
-        isDisplayingNotification = true;
-
-        intervalId = setInterval(function() {
-          if (document.title === 'App') {
-            document.title = `(${messages}) New messages`;
-          } else {
-            document.title = 'App';
-          }
-        }, 1000);
-      }
-
-      function stopNotification() {
-        isDisplayingNotification = false;
-
-        clearInterval(intervalId);
-        document.title = 'App';
-      }
     </script>
-  </body>
-</html>
\ No newline at end of file
+</body>
+
+</html>
