index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./main.css"/>
    <script src='./script.js' defer></script>
    <title>Blackjack</title>
</head>
<body>
    <h1>Blackjack</h1>
    
    <!-- Dealer Area-->
    <h2>Dealer: <span id= 'dealer-sum'></span></h2>
    <div id= 'dealer-cards'>
        <img id= 'hidden' src= "./cards/BACK.png">
    </div>

    <!-- Player Area -->
    <h2>Player: <span id= 'player-sum'></span></h2>
    <div id= 'player-cards'></div>

    <!-- Buttons -->
    <br>
    <button id="deal"> Deal</button>         
    <button id="hit"> Hit</button>
    <button id="stay"> Stay</button>    
    <p id="outcome"></p>
</body>
</html>