JSFiddle - React, Tailwind, and code Playground

by nukeboy212

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<div class="col-xs-6">
  <h1>
YouTuber
</h1>
  <button id="RV">
    Record Video
  </button>
  <button id="vlog">
    Vlog
  </button>
  <button id="game">
    Game
  </button>
  <button id="gtp">
    GTP V
  </button>
  <button id="deepio">
    Deep.io
  </button>
  <button id="digcraft">
    Digcraft
  </button>
  <button id="cimCity">
    Cim City
  </button>
  <button id="rublox">
    Rublox
  </button>
  <button id="friends">
    Ask Friends To Watch! (Head Start!)
  </button>
</div>
<div class="col-xs-6">
  <h2 id="subs">
Subscribers
</h2>
  <h3 id="views">
Views
</h3>
  <h3 id="videos">
Videos
</h3>

</div>

CSS

body {
  background-color: Red;
}

h1 {
  color: white;
  font-family: arial, sans-serif;
}

h2 {
  float: right;
}

h3 {
  float: right;
  clear: right;
  color: white;
}

button {
  display: block;
}

JavaScript

var views = 0;
var subs = 0;
var moneyz = 50;
var videos = 0;

var gtpsubs = 0;
var gtpviews = Math.floor(Math.random() * 3);
var gtpviewspv = 4

var deepsubs = 0;
var deepviews = Math.floor(Math.random() + 0.5);

var cheat = false;

$("#views").text("Views: " + views)
$("#subs").text("Subscribers: " + subs)
$("#videos").text("Videos: " + videos)
  //var food = 0;
$("#vlog").hide();
$("#game").hide();
$("#digcraft").hide();
$("#gtp").hide();
$("#deepio").hide();
$("#rublox").hide();
$("#cimCity").hide();

setInterval(function() {
    randomgtpthings();
    if (cheat == true && views < 95) {
      gtpviews = Math.floor(Math.random() * 10) + 5;
    } else if (views >= 15 && views <= 30) {
      gtpviews = Math.floor(Math.random() * 5) + 1;
    } else if (views >= 30 && views <= 40) {
      gtpviews = Math.floor(Math.random() * 7) + 1;
    } else if (views >= 40 && views <= 55) {
      gtpviews = Math.floor(Math.random() * 7) + 2;
    } else if (views >= 55 && views <= 70) {
      gtpviews = Math.floor(Math.random() * 9) + 3;
    } else if (views >= 70 && views <= 80) {
      gtpviews = Math.floor(Math.random() * 10) + 3;
    } else if (views >= 80 && views <= 95) {
      gtpviews = Math.floor(Math.random() * 10) + 4;
    } else if (views >= 95 && views <= 120) {
      gtpviews = Math.floor(Math.random() * 15) + 6;
    }
$("#subs").text("Subscribers: " + subs)
}, 50)

function randomgtpthings() {
  gtpviews = Math.floor(Math.random() * gtpviewspv);
  if (views > 100 || views == 100) {
    gtpsubs = Math.floor(Math.random() + 0.5);
  }

}
var answer = prompt("Who are you going to call yourself in this magical adventure?");
$("h1").text("YouTuber: " + answer)

function show() {
  $("#RV").show();
  $("#digcraft").hide();
  $("#gtp").hide();
  $("#deepio").hide();
  $("#rublox").hide();
  $("#cimCity").hide();
}

$("#RV").click(function() {
  $("#RV").hide();
  $("#vlog").show();
  $("#game").show();

});

$("#game").click(function() {
  $("#vlog").hide();
 ...