🏣🐴 Checkpoint

./public/script.js:1954897/2537
./views/index.html:1954897/4310

public/script.js

@@ -0,0 +1,14 @@
+(function() {
+    'use strict';
+    var btns = document.querySelectorAll('[data-rules]')
+
+    for (var i = 0; i < btns.length; i++) {
+        console.log('hi')
+        btns[i].addEventListener('click', function (e) {
+            [].forEach.call(document.body.children, (el) => {
+                el.hidden = this.dataset.open === el.id
+            })
+        })
+    }
+
+}());

views/index.html

@@ -34,8 +34,8 @@
                 <p class="warn">Este juego requiere que JavaScript esté habilitado. Por favor préndalo y actualiza la página.</p>
             </noscript>
             <div class="flex no-js-hide">
-                <button class="btn">Jugar</button>
+                <button class="btn" data-open="view1">Jugar</button>
-                <button class="btn" onclick="openRules">Repasar las reglas</button>
+                <button class="btn" data-open="rules">Repasar las reglas</button>
             </div>
         </div>
         <div class="container" id="rules" hidden>
@@ -43,11 +43,11 @@
             <p>
                 Cada quien tendrá una palabra o frase en la frente. El objetivo es hacer que la digan.
             </p>
-            <button class="btn" onclick="openMain">Entendido</button>
+            <button class="btn" data-open="previous">Entendido</button>
         </div>
-        <div class="container middle" id="view2" hidden>
+        <div class="container middle" id="view1" hidden>
             <h1 class="h4 center">Dale el celular a la persona a tu izquierda.</h1>
-            <button class="btn">¡Listo!</button>
+            <button class="btn" data-open="view3">¡Listo!</button>
         </div>
     </body>
     <script src="./script.js" charset="utf-8"></script>