JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

    <title>Power up incremental by Tarnos</title>
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="css/jquery-ui.min.css" rel="stylesheet" type="text/css" />
    <link href="css/main.css" rel="stylesheet" type="text/css">

      <script>
          $(function () {
              $('[data-toggle="tooltip"]').tooltip()
          })
  </script>
<body>
    <div class="container-fluid">
        <div class="row borderBottom">
            <div class="col-xs-8 col-xs-offset-2">
                <div class="gameLogo"></div>
            </div>
        </div>
        <div class="row">
            <div class="col-xs-4">
                <div class="text-center">Player Stats</div>
                <div class="row" data-bind="foreach: {data: Object.keys(player.baseStats), as: '_propkey'}">
                    <div class="col-xs-6 text-center" data-bind="foreach: {data: player.baseStats[_propkey], as: '_player'}">
                        <div data-toggle="tooltip" data-placement="bottom" data-bind="attr:{title: 'Growth: ' + _player['growth']()}">
                                <span data-bind="text: _propkey + ': ' + _player['value']()"></span>
                            <div class="progress">
                                <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" data-bind="style: { width: progressPerCent(_propkey) + '%'}">
                                    <span data-bind="text: ' Exp: ' + _player['minExp']() + '/' + _player['maxExp']()"></span>
                                </div>
   ...

CSS

.progress {
    position: relative;
    margin-bottom:10px;
}

.progress span {
    position: absolute;
    display: block;
    width: 100%;
    color: black;
 }
.gameLogo{
    background-image:url(/images/logo.png);
    background-repeat:no-repeat;
    background-size:auto;
    height: 75px;
}
.borderBottom{
    border-bottom:1px solid;
}
.progress-bar{
    -webkit-transition: width .1s ease;
    transition: width .1s ease;
}

JavaScript

function AppViewModel() {
    var self = this;
    player = new playerTest();
    enemies = new enemiesTest();
    activeEnemy = new initializeFirstEnemy();
    console.log('Call me more pls');
};
var baseStatsArray = ['Strength', 'Endurance', 'Speed', 'Luck'];
var currentEnemy = ko.observable(0);
function playerTest() {
    var self = this;
    var value;
    var growth;
    this.baseStats = {};
    for (var i = 0; i < baseStatsArray.length; i++) {
        var attr = baseStatsArray[i];
        this.baseStats[attr] = {};
        this.baseStats[attr]['value'] = ko.observable(5);
        this.baseStats[attr]['growth'] = ko.observable(2);
        this.baseStats[attr]['minExp'] = ko.observable(0);
        this.baseStats[attr]['maxExp'] = ko.computed(function () {
            return Math.floor((10 + (self.baseStats[attr]['value']() / 2)) / self.baseStats[attr]['growth']());
        });
    };
};
var enemyList = [];
function enemiesTest() {
    var self = this;
    var human = new enemyCreate('Human', 1, 1);
    human.visible = true;
    enemyList.push(human);
    var orc = new enemyCreate('Orc', 2, 2);
    enemyList.push(orc);

    for (var i = 3; i < 4; i++) {
        var monster = new enemyCreate(('monster00' + i), i, i);
        enemyList.push(monster);
    }

    return enemyList;
};
function enemyCreate(name, level, power) {
    var self = this;
    this.name = name;
    this.level = level
    this.power = power// Power as "normal/elite/boss" used to increase opponent stats
    this.health = self.level * 10 + self.power * 5;
    this.maxHealth = this.health;
    this.visible = ko.observable(false);
};

function initializeFirstEnemy() {
    var enemyTest = {};
    for (var key in enemyList[0]) {
        var enemyStats = enemyList[0][key];
        enemyTest[key] = ko.observable(enemyStats);
    };
    return enemyTest;
};
function chooseNewEnemy(current) {
    if (current >= 0) {
        currentEnemy(current);
    }
    var enemyPosition =...