This probably doesn't conform to your "rules", but at least it does something.
Code:
<html>
<head><title>Cards</title>
<script type="text/javascript">
var cardNames = ["Ace","Deuce","Trey",4,5,6,7,8,9,10,"Jack","Queen","King"];
var cardSuits = ["Clubs","Diamonds","Hearts","Spades"]
var cardImageNames = [ 1,2,3,4,5,6,7,8,9,"0","J","Q","K" ];
function getCard(which)
{
var cardNum = Math.floor(Math.random()*13);
var cardSuit = Math.floor(Math.random()*4);
var cardName = cardNames[cardNum] + " of " + cardSuits[cardSuit];
var imgSrc = cardSuit + "-" + cardImageNames[cardNum] + ".jpg";
document.getElementById("card" + which).src = imgSrc;
document.getElementById("cardText" + which).innerHTML = cardName;
return cardNum;
}
function spin( )
{
var c1 = getCard(1);
var c2 = getCard(2);
var msg;
if ( c1 == c2 )
{
msg = "A tie!";
} else if ( c1 < c2 ) {
msg = "Card 2 wins";
} else {
msg = "Card 1 wins";
}
document.getElementById("winnerInfo").innerHTML = msg;
}
</script>
</head>
<body>
<br/><br/><br/><br/>
<button type="button" onclick="spin()">deal</button>
<br/>
<hr/>
<br/>
Card 1: <span id="cardText1"></span><img id="card1" alt="card 1"/><br/>
Card 2: <span id="cardText2"></span><img id="card2" alt="card 2"/><br/>
<div id="winnerInfo"></div>
</body>
</html>