JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://bootswatch.com/amelia/bootstrap.min.css">
<h1>Fantastisk terningspil(d)</h1>
<div class="container">
<div id="terninger" class="row">
</div>
<button id="bland">Bland!</bland>
</container>

CSS

body {
padding: 20px;
}
#terninger>div {
    background: url("http://blog.mauveweb.co.uk/wp-content/uploads/2006/09/dice_under_development.png") no-repeat 0px -429px;
height: 100px;
width: 100px;
border-radius: 18px;
margin-bottom: 20px;
box-shadow: 0px 0px 10px white;
}

.dice2 {background-position: -108px -429px !Important;}
.dice3 {background-position: -216px -429px !Important;}
.dice4 {background-position: -321px -429px !Important;}
.dice5 {background-position: -430px -429px !Important;}
.dice6 {background-position: -540px -429px !Important;}

JavaScript

function bland() {
var udfald = '';
for(var i=0; i<3; i++) { 
    var slag = (parseInt(Math.random()*6)+1);
    udfald+='<div class="span2 dice'+slag+'" title="'+slag+'"></div>'
};
    $terninger.html(udfald);
}

var $terninger = $('#terninger');
var $bland = $('#bland').on('click', bland).trigger('click');