Disappearing buttons

Can't get it to work between popups.

beastify/popup/choose_beast.css

@@ -25,3 +25,8 @@ html, body {
 .clear:hover {
   background-color: #C0392B;
 }
+
+.inactive {
+  opacity: 0;
+  pointer-events: none;
+}

beastify/popup/choose_beast.html

@@ -10,8 +10,8 @@
   <div class="button beast">Frog</div>
   <div class="button beast">Turtle</div>
   <div class="button beast">Snake</div>
-  <div class="button clear">Blank</div>
-  <div class="button clear">Reload</div>
+  <div class="button clear inactive">Reload</div>
+  <div class="button clear inactive">Blank</div>
   <script src="choose_beast.js"></script>
 </body>
 

beastify/popup/choose_beast.js

@@ -1,6 +1,30 @@
 /*
 Given the name of a beast, get the URL to the corresponding image.
 */
+
+/*
+updateButtons():
+* looks in the self.beast variable to see if the page is beastified or not,
+* updates the buttons with the inactive property if the page is not beastified
+* does tho opposite in the case it is beastified
+*/
+function updateButtons() {
+  if (self.beast) {
+    var list = document.getElementsByClassName("clear");
+    for (var i = 0; i < list.length; i++) {
+        list[i].className = "button clear";
+    }
+  }
+  else {
+    var list = document.getElementsByClassName("clear");
+    for (var i = 0; i < list.length; i++) {
+        list[i].className = "button clear inactive";
+    }
+  }
+}
+
+updateButtons();
+
 function beastNameToURL(beastName) {
   switch (beastName) {
     case "Frog":
@@ -12,7 +36,6 @@ function beastNameToURL(beastName) {
   }
 }
 
-
 /*
 Listen for clicks in the popup.
 
@@ -44,6 +67,10 @@ document.addEventListener("click", function(e) {
     chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
       chrome.tabs.sendMessage(tabs[0].id, {beastURL: chosenBeastURL});
     });
+
+    self.beast = true;
+
+    updateButtons();
   }
   else if (e.target.classList.contains("clear")) {
     var chosenMethod = e.target.textContent;
@@ -55,6 +82,10 @@ document.addEventListener("click", function(e) {
     chrome.tabs.query({active: true, currentWindow: true}, function(tabs) {
       chrome.tabs.sendMessage(tabs[0].id, {type: chosenMethod});
     });
+
+    self.beast = false;
+
+    updateButtons();
   }
 
   return;