Digital Solutions

Trader Game

traderGame.html

<!DOCTYPE html>
<html>
    <head>
        <title>Stock trader game</title>
        <link rel="stylesheet" type="text/css" href="traderGame.css">
    </head>
    <body onload="reset()">
        <h1>Stock trader game</h1>
        
        <table>
            <tr>
                <td>Hours remaining:</td>
                <td><span id="hoursleft"></span></td>
            </tr>
            <tr>
                <td>Stocks:</td>
                <td><span id="stocks"></span></td>
            </tr>
            <tr>
                <td>Money:</td>
                <td>$<span id="money"></span></td>
            </tr>
        </table>
        
        <br><hr><br>
        
        <table>
            <tr>
                <td>Trading stocks:</td>
                <td>$<span id="tradeprice"></span></td>
            </tr>
            <tr>
                <td colspan="2">Actions:</td>
            </tr>
            <tr>
                <td colspan="2">
                    <input type="button" value="Buy" onclick="buy()">
                    <input type="button" value="Sell" onclick="sell()">
                    <input type="button" value="Wait 1hr" onclick="wait()">
                </td>
            </tr>
        </table>
        
        
        <script src="traderGame.js"></script>
    </body>
</html>

traderGame.css

table {
    border-collapse: collapse;
}

td {
    border: 3px solid #778899;
    text-align: left;
    padding: 5px;
}

traderGame.js

var shops, hoursleft, tradeprice, stocks, money; 

function update(){
    document.getElementById("hoursleft").innerHTML = hoursleft;
    document.getElementById("tradeprice").innerHTML = tradeprice;
    document.getElementById("stocks").innerHTML = stocks;
    document.getElementById("money").innerHTML = money;
}

function sell(){
    var sellAmount = parseInt(prompt("How many stocks to sell?"));
    if(sellAmount <= stocks){
        var profit = sellAmount * tradeprice;
        money = money + profit;
        stocks = stocks - sellAmount;
        alert("Sold " + sellAmount + " stocks, you have made $" + profit);
        update();
    }
    else{
        alert("You don't have enough stocks.")
    }
}

function buy(){
    var buyAmount = parseInt(prompt("How many stocks to buy?"));
    var cost = buyAmount * tradeprice;
    if(cost <= money){
        money = money - cost;
        stocks = stocks + buyAmount;
        alert("Bought " + buyAmount + " stocks, which cost you $" + cost);
        update();
    }
    else{
        alert("You don't have enough money.")
    }
}

function wait(){
    hoursleft = hoursleft - 1;
    if (hoursleft < 1){
        alert("GAME OVER. FINAL SCORE: $" + money);
        location.reload();
    }
    else{
        generateRandomTradePrice();
        update();
        alert("An hour has passed..");
    }
}

function reset(){
    generateRandomTradePrice();
    hoursleft = 12;
    stocks = 0;
    money = 10;
    update();
}
    
function generateRandomTradePrice(){
    tradeprice = Math.floor((Math.random() * 20) + 1)
}

Improve headings, add rules (HTML) and refine aesthetics (CSS)

You could also improve / modify game mechanics (JS), such as:

implement a message area span, so i don't have to rely on window alerts to communicate my messages
add stock availability
cap stock limits, and allow the user to ability to increase their transaction size (i.e. initially set max to 100 stocks, but perhaps can spend 1k to increase portfolio to 200 stocks etc.)
have different stocks
have a random chance of a stock dip / dive or spike
have a bank where money could be deposited that could earn interest paid hourly at a fixed / variable rate