I'm working on a blackjack game for fun, I'm having a problem adding the cards though. What would I do to add the last card to a score that was put down?
It's not a complete game yet, its just a project and please don't bash my code

lol
Code:
<html>
<head>
<style type="text/css">
#playing_area{
height: 400px;
width: 600px;
position: relative;
border: 1px solid black;
background-color: #088A4B;
}
#dealer_area{
border: 1px solid black;
}
#player_area{
}
.card{
height: 60px;
width: 40px;
background-color: white;
border: 1px solid black;
float: left;
-moz-border-radius: 10px 10px;
border-radius: 10px 10px;
padding: 5px;
box-shadow: 5px 5px 5px;
-moz-box-shadow: 5px 5px 5px;
}
</style>
</head>
<body>
<div id="playing_area">
<button id="start">Start Game</button>
<div id="dealer_area">
<h3 style="text-align: center;">Dealer</h3>
<div id="dealer_cards"></div>
<div id="dealer_score"></div>
</div>
<div id="player_area"></div>
</div>
<script type="text/javascript">
var start=document.getElementById('start');
var dealer=document.getElementById('dealer_area');
var dealerCards=document.getElementById('dealer_cards');
var dealerScore = document.getElementById('dealer_score');
var i;
var score=0;
//declare the array of the deck of cards
var deck = new Array();
deck[0]=1;
deck[1]=2;
deck[2]=3;
deck[3]=4;
deck[4]=5;
deck[5]=6;
deck[6]=7;
deck[7]=8;
deck[8]=9;
deck[9]=10;
deck[10]=11;
deck[11]=12;
function gamestart(){
var i= Math.round( Math.random(i)*11);
var newCard = document.createElement('div');
var card=dealerCards.appendChild(newCard);
card.innerHTML = deck[i];
card.setAttribute('class','card');
}
start.setAttribute('onclick', 'gamestart()');
</script>
</body>
</html>