<div id="cards" onclick="DoC();"><img src="img/ru.png"></div>
<script>
var cards = document.getElementById('cards'), counter = 36;
var arr = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30", "31", "32", "33", "34", "35", "36", ];
function DoC() {
if(counter > 0){
counter--;
if(counter % 2 != 0){
var rand = Math.floor(Math.random() * arr.length);
cards.innerHTML = '<img src="img/'+arr[rand]+'.png">';
arr.splice(rand, 1)
}else{
cards.innerHTML = '<img src="img/ru.png">';
}
}else{
alert('Колода закончилась');
}
}
</script>
Чтобы все заработало, нужно создать папку "img" и положить в нее колоду карт в виде картинок png, пронумерованных от 1 до 36. Плюс в эту же папку положить картинку с рубашкой колоды "ru.png".