diff --git a/scripts/pi-hole/js/footer.js b/scripts/pi-hole/js/footer.js
index b7536404..94cfc82a 100644
--- a/scripts/pi-hole/js/footer.js
+++ b/scripts/pi-hole/js/footer.js
@@ -574,14 +574,41 @@ $("#settings-level").on("change", function () {
 });
 
 function addAdvancedInfo() {
-  const advancedInfoSource = $("#advanced-info");
-  const advancedInfoTarget = $("#advanced-info-target");
-  if (settingsLevel >= 2) {
-    advancedInfoTarget.html(advancedInfoSource.html());
-    advancedInfoTarget.show();
-  } else {
+  const advancedInfoSource = $("#advanced-info-data");
+  const advancedInfoTarget = $("#advanced-info");
+  const isTLS = advancedInfoSource.data("tls");
+  const clientIP = advancedInfoSource.data("client-ip");
+  const starttime = parseFloat(advancedInfoSource.data("starttime"));
+  const endtime = parseFloat(advancedInfoSource.data("endtime"));
+  const totaltime = 1e3 * (endtime - starttime);
+
+  // Hide advanced info if settings level is lower than 2
+  if (settingsLevel < 2) {
     advancedInfoTarget.hide();
+    return;
   }
+
+  // Show advanced info
+  advancedInfoTarget.empty();
+
+  // Add TLS and client IP info
+  advancedInfoTarget.append(
+    'Client: <i class="fa-solid fa-fw fa-lock' +
+      (isTLS ? "" : "-open") +
+      '" title="Your connection is ' +
+      (isTLS ? "" : "NOT ") +
+      'end-to-end encrypted (TLS/SSL)"></i>&nbsp;' +
+      clientIP +
+      "<br>"
+  );
+
+  // Add render time info
+  advancedInfoTarget.append(
+    "Render time: " + (totaltime > 0.5 ? totaltime.toFixed(1) : totaltime.toFixed(3)) + " ms"
+  );
+
+  // Show advanced info
+  advancedInfoTarget.show();
 }
 
 $(function () {
diff --git a/scripts/pi-hole/lua/footer.lp b/scripts/pi-hole/lua/footer.lp
index 595a328f..c3d8dda3 100644
--- a/scripts/pi-hole/lua/footer.lp
+++ b/scripts/pi-hole/lua/footer.lp
@@ -59,11 +59,6 @@
 <!-- ./wrapper -->
 <script src="<?=pihole.fileversion('scripts/pi-hole/js/footer.js')?>"></script>
 
-<div id="advanced-info" style="display: none;">
-    <strong>Advanced info</strong><br>
-    <? totaltime = 1e3*(mg.time(true)-starttime) ?>
-    Client: <i class="fa-solid fa-fw fa-lock<? if not mg.request_info.https then mg.write("-open") end ?>" title="Your connection is <? if not mg.request_info.https then mg.write("NOT ") end ?>end-to-end encrypted (TLS/SSL)"></i>&nbsp;<?=mg.request_info.remote_addr?><br>
-    Render time: <? if totaltime > 0.5 then mg.write(string.format("%.1f",totaltime)) else mg.write(string.format("%.3f",totaltime)) end ?> ms
-</div>
+<div id="advanced-info-data" style="display: none;" data-starttime="<?=starttime?>" data-endtime="<?=mg.time(true)?>" data-client-ip="<?=mg.request_info.remote_addr?>" data-tls="<?=tostring(mg.request_info.https)?>"></div>
 </body>
 </html>
diff --git a/scripts/pi-hole/lua/header_authenticated.lp b/scripts/pi-hole/lua/header_authenticated.lp
index 7583d443..be6c45d6 100644
--- a/scripts/pi-hole/lua/header_authenticated.lp
+++ b/scripts/pi-hole/lua/header_authenticated.lp
@@ -83,7 +83,7 @@ mg.include('header.lp','r')
                                 </p>
                             </li>
                             <!-- Menu Body -->
-                            <li class="user-body" id="advanced-info-target" style="display:none;"></li>
+                            <li class="user-body" id="advanced-info" style="display:none;"></li>
                             <!-- Menu Footer -->
                             <li class="user-footer">
                                 <a class="btn-link" href="https://pi-hole.net/" rel="noopener" target="_blank">