diff --git a/spring-geode-samples/caching/inline-async/src/main/resources/static/cache-view.html b/spring-geode-samples/caching/inline-async/src/main/resources/static/cache-view.html
deleted file mode 100644
index ee191aaf..00000000
--- a/spring-geode-samples/caching/inline-async/src/main/resources/static/cache-view.html
+++ /dev/null
@@ -1,54 +0,0 @@
-<html>
-    <head>
-        <title>Golf Tournament Cache View</title>
-        <script src="jquery-3.5.1.min.js"></script>
-        <script type="JavaScript">
-
-            function golfTournamentStandingsRunner() {
-
-                $.ajax({
-                    type: "GET",
-                    url: "http://localhost:8080/golf/tournament/cache",
-                    dataType: "json",
-                    success: function(golfers) {
-                        var table = $("#golfers #tbody")
-                        table.clear();
-                        $.each(golfers, function(index, golfer) {
-                            table.append("<tr><td>" + golfer.name + "</td>/<tr>");
-                            table.append("<tr><td>" + golfer.hole + "</td>/<tr>");
-                            table.append("<tr><td>" + golfer.score + "</td>/<tr>");
-                        })
-                    },
-                    complete: function() {
-                        setTimeout(
-                    }
-                    error: function() {
-                        alert("What???");
-                    }
-                })
-            }
-
-            $(document).ready(function() {
-                //setTimeout(golfTournamentStandingsRunner, 2500);
-                setInterval(golfTournamentStandingsRunner, 1000);
-            });
-        </script>
-    </head>
-    <body>
-        <h1>The Masters - CACHE</h1>
-        <table id="golfers" border="1">
-            <thead>
-            <tr>
-                <th width="100">Name</th>
-                <th width="100">Hole</th>
-                <th width="100">Score</th>
-            </tr>
-            </thead>
-            <tbody>
-                <tr><td>?</td></tr>
-                <tr><td>0</td></tr>
-                <tr><td>0</td></tr>
-            </tbody>
-        </table>
-    </body>
-</html>
diff --git a/spring-geode-samples/caching/inline-async/src/main/resources/static/database-view.html b/spring-geode-samples/caching/inline-async/src/main/resources/static/database-view.html
deleted file mode 100644
index 4071a0a6..00000000
--- a/spring-geode-samples/caching/inline-async/src/main/resources/static/database-view.html
+++ /dev/null
@@ -1,55 +0,0 @@
-<html>
-    <head>
-        <title>Golf Tournament Database View</title>
-        <script src="jquery-3.5.1.min.js"></script>
-        <script type="JavaScript">
-
-            function golfTournamentStandingsRunner() {
-
-                $.ajax({
-                    type: "GET",
-                    url: "http://localhost:8080/golf/tournament/database",
-                    dataType: "json",
-                    success: function(golfers) {
-                        var table = $("#golfers #tbody")
-                        table.clear();
-                        $.each(golfers, function(index, golfer) {
-                            table.append("<tr><td>" + golfer.name + "</td>/<tr>");
-                            table.append("<tr><td>" + golfer.hole + "</td>/<tr>");
-                            table.append("<tr><td>" + golfer.score + "</td>/<tr>");
-                        })
-                    },
-                    complete: function() {
-                        setTimeout(
-                    }
-                    error: function() {
-                        alert("What???");
-                    }
-                })
-            }
-
-            $(document).ready(function() {
-                //setTimeout(golfTournamentStandingsRunner, 2500);
-                setInterval(golfTournamentStandingsRunner, 1000);
-                alert("HELLO!");
-            });
-        </script>
-    </head>
-    <body onload="">
-        <h1>The Masters - DATABASE</h1>
-        <table id="golfers" border="1">
-            <thead>
-            <tr>
-                <th width="100">Name</th>
-                <th width="100">Hole</th>
-                <th width="100">Score</th>
-            </tr>
-            </thead>
-            <tbody>
-                <tr><td>?</td></tr>
-                <tr><td>0</td></tr>
-                <tr><td>0</td></tr>
-            </tbody>
-        </table>
-    </body>
-</html>
diff --git a/spring-geode-samples/caching/inline-async/src/main/resources/static/golf-tournament-view.html b/spring-geode-samples/caching/inline-async/src/main/resources/static/golf-tournament-view.html
new file mode 100644
index 00000000..fa20eb92
--- /dev/null
+++ b/spring-geode-samples/caching/inline-async/src/main/resources/static/golf-tournament-view.html
@@ -0,0 +1,102 @@
+<html>
+    <head>
+        <title>Golf Tournament Cache View</title>
+        <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
+        <script>
+
+                function golfTournamentStandingsRunner(apiUrl, tableId) {
+
+                    $.ajax({
+                        type: "GET",
+                        url: apiUrl,
+                        dataType: "json",
+                        success: function(golfers) {
+                            var table = $(tableId + " tbody");
+                            $(tableId + " tbody tr").remove();
+                            var count = 1;
+                            $.each(golfers, function(index, golfer) {
+                                var backgroundColor = count % 2 == 0 ? "lightgray" : "white";
+                                table.append("<tr bgcolor=\"" + backgroundColor + "\"><td width=\"200\">" + golfer.name + "</td><td width=\"100\">" + golfer.hole + "</td><td width=\"100\">" + golfer.score + "</td></tr>");
+                                count++;
+                            })
+                        },
+                        error: function() {
+                            console.log("What?!");
+                        }
+                    })
+                }
+
+                function golfTournamentCacheStandingsRunner() {
+                    golfTournamentStandingsRunner("http://localhost:8080/golf/tournament/cache", "#golfersInCache");
+                }
+
+                function golfTournamentDatabaseStandingsRunner() {
+                    golfTournamentStandingsRunner("http://localhost:8080/golf/tournament/database", "#golfersInDatabase");
+                }
+
+                $(document).ready(function() {
+                    console.log("DOM Ready");
+                    //setTimeout(golfTournamentStandingsRunner, 2500);
+                    setInterval(golfTournamentCacheStandingsRunner, 2000);
+                    setInterval(golfTournamentDatabaseStandingsRunner, 2000);
+                });
+
+                $(window).on("load", function() {
+                    console.log("Window Ready");
+                });
+            </script>
+    </head>
+    <body>
+
+        <center><font color="darkgreen" size="36"><b><i>The Masters - CACHE vs DATABASE</i></b></font></center>
+
+        <table id="golfersCacheVsDatabase" width="100%" border="0">
+            <thead>
+                <tr>
+                    <td align="center" width="50%"><b>CACHE</b></td>
+                    <td align="center" width="50%"><b>DATABASE</b></td>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <td align="center">
+                        <table id="golfersInCache" border="1">
+                            <thead>
+                                <tr>
+                                    <th width="200">Name</th>
+                                    <th width="100">Hole</th>
+                                    <th width="100">Score</th>
+                                </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>?</td>
+                                    <td>--</td>
+                                    <td>--</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </td>
+                    <td align="center">
+                        <table id="golfersInDatabase" border="1">
+                            <thead>
+                            <tr>
+                                <th width="200">Name</th>
+                                <th width="100">Hole</th>
+                                <th width="100">Score</th>
+                            </tr>
+                            </thead>
+                            <tbody>
+                                <tr>
+                                    <td>?</td>
+                                    <td>--</td>
+                                    <td>--</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    </body>
+</html>
