diff --git a/index.php b/index.php
index 7410399..945fb30 100644
--- a/index.php
+++ b/index.php
@@ -10,8 +10,8 @@ if (isset($_GET['wake'])) {
   $return = shell_exec('wakeonlan '.$_GET['wake']);
 }
 
-$clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
-            "magrathea"  =>"60:03:08:9c:25:6a"];
+$clients = ["nuc6i5-host.fra80"=>"b8:ae:ed:ec:18:f7",
+            "magrathea.fra80"  =>"60:03:08:9c:25:6a"];
 ?>
 
 <!DOCTYPE html>
@@ -24,13 +24,17 @@ $clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
       body {
         max-width: 500px;
         margin: 0 auto;
-        padding: 0 5px;
+        padding: 0 10px;
         font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
       }
+      body > h1:first-child { margin-top: 0.3em; }
       small {
         font-size: 0.7em;
         font-weight: 500;
       }
+      ul {
+        padding-left: 20px;
+      }
       li {
         margin-bottom: 1.5em;
       }
@@ -38,6 +42,16 @@ $clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
         color: blue;
       }
 
+      div.info {
+        margin: -10px; padding: 10px;
+        background-color: #e2e2e2;
+        border: 1px solid #787878;
+        border-radius: 5px;
+      }
+      div.info > p:first-child {
+        margin-top: 0;
+      }
+
       .red { color: red; }
       .green { color: green; }
     </style>
@@ -45,24 +59,58 @@ $clients = ["nuc6i5-host"=>"b8:ae:ed:ec:18:f7",
   <body>
     <h1>Wake On LAN Service</h1>
 <?php if (isset($return)) : ?>
-    <p>The command returned:</p>
-    <pre><?php echo $return; ?></pre>
-    <a href="index.php">OK</a>
+    <div class="info">
+      <p>The command returned:</p>
+      <pre><?php echo $return; ?></pre>
+      <a href="index.php">OK</a>
+    </div>
 <?php endif; ?>
-    <p>I can wake up the following clients:</p>
-    <ul>
+    <p>I can try to wake up the following clients for you:</p>
+    <ul id="clients">
 <?php foreach ($clients as $name=>$mac) : ?>
-      <li>
-        <a href="?wake=<?php echo $mac ?>"><?php echo $name ?> (<?php echo $mac ?>)</a>
-        <?php $foo = array(); $status; exec("ping -c 1 ".$name.".fra80", $foo, $status); ?>
-<?php if (!$status) : ?>
-        <span class="green">&#8226;</span> online
-<?php else : ?>
-        <span class="red">&#8226;</span> offline
-<?php endif; ?>
+      <li data="<?php echo $name ?>">
+        <a href="?wake=<?php echo $mac ?>">wake up</a> <?php echo $name ?> (<?php echo $mac ?>)
       </li>
 <?php endforeach; ?>
     </ul>
   </body>
-</html>
+  <script type="text/javascript">
+    clients = document.getElementById("clients").children;
+    for (var i = 0; i < clients.length; i++) {
+      element = clients[i];
+      hostname = clients[i].attributes['data'].value;
 
+      console.log("ping: " + hostname);
+      asyncRequest(element, hostname);
+    }
+
+    function asyncRequest(element, hostname) {
+      var xhttp = new XMLHttpRequest();
+      xhttp.onreadystatechange = function(){
+        if (this.readyState == 4) {
+          if (this.status == 200) {
+            callBack(element, xhttp.responseText, this.status);
+          } else {
+            console.log("Error requesting ping: " + this.status + ", " + xhttp.responseText);
+          }
+        }
+      };
+      xhttp.open("GET", "ping.php?hostname=" + hostname, true);
+      xhttp.send();
+
+      function callBack(element, response, statusCode) {
+        var node = document.createElement("span");
+        node.innerHTML = "&#8226;";
+        if (xhttp.responseText.substring(0, 1) == "1") {
+          node.className = "green";
+          element.appendChild(node);
+          element.append(" online");
+        } else {
+          node.className = "red";
+          element.appendChild(node);
+          element.append(" offline");
+        }
+      }
+    }
+  </script>
+</html>
diff --git a/ping.php b/ping.php
new file mode 100644
index 0000000..23a6dac
--- /dev/null
+++ b/ping.php
@@ -0,0 +1,20 @@
+<?php
+// -------------------------------------------
+// Wake On LAN Webclient -- on private LAN
+
+// copyright: Jannik Beyerstedt | https://jannikbeyerstedt.de
+// license: http://www.gnu.org/licenses/gpl-3.0.txt GPLv3 License
+// -------------------------------------------
+
+if (isset($_GET['hostname'])) {
+	$foo = array(); $status;
+	exec("ping -c 1 ".$_GET['hostname'], $foo, $status);
+	if (!$status) {
+    echo "1 online";
+  } else {
+    echo "0 offline";
+	}
+} else {
+	header("HTTP/1.1 400 Bad Request");
+	echo "ERROR: invalid request";
+}
