diff --git a/index.html b/index.html
index 904a956..b341ef7 100644
--- a/index.html
+++ b/index.html
@@ -124,11 +124,10 @@
 <body>
 <div class="container" id="appContainer">
     <div>
-        <div class="nav-tab active" onclick="changeTab(event, 'config')">Configuration</div>
-        <div class="nav-tab" onclick="changeTab(event, 'csv')">CSV Management</div>
-        <div class="nav-tab" onclick="changeTab(event, 'email')">Email Operations</div>
+        <div class="nav-tab active" id="configTab">Configuration</div>
+        <div class="nav-tab" id="csvTab">CSV Management</div>
+        <div class="nav-tab" id="emailTab">Email Operations</div>
     </div>
-
     <div id="config" class="tab-content active">
         <label for="user">User:</label>
         <input type="text" id="user" name="user">
@@ -159,16 +158,26 @@
     <div id="email" class="tab-content">
         <!-- Email Operations Content -->
         <button class="button">Send Emails</button>
-        <textarea rows="10">Log output here...</textarea>
+        <label>
+            <textarea rows="10">Log output here...</textarea>
+        </label>
     </div>
 
     <div class="status-bar" id="statusMessage">Status: Ready</div>
 </div>
 <script>
     document.addEventListener("DOMContentLoaded", function () {
-        // Event listeners for buttons
         document.getElementById('loadConfigBtn').addEventListener('click', loadConfig);
         document.getElementById('saveConfigBtn').addEventListener('click', saveConfig);
+        document.getElementById('configTab').addEventListener('click', function (event) {
+            changeTab(event, 'config')
+        });
+        document.getElementById('csvTab').addEventListener('click', function (event) {
+            changeTab(event, 'csv')
+        });
+        document.getElementById('emailTab').addEventListener('click', function (event) {
+            changeTab(event, 'email')
+        });
     });
 
     function changeTab(event, tabId) {
