Untitled

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">


</head>
<body>
    <script src="main.js"></script>
    <section>
        <h1>ATM Cash Disbursement Problem</h1>
        <p>
            An ATM asks for a given amount of money and gives its user a certain number of bills matching the given amount.
        </p>
        <p>
            Create a program that takes the amount asked by the user as an input (integer) and outputs what quantity is needed for each
            bill (see
            <a href="#types-of-bills">Types of bills</a>) so that the ATM can give the amount of money the user asked.
        </p>
        <h1>Example</h1>
        <samp>
            Input>
            <kbd>1550</kbd>
            <br/> Output:
            <br/> * 1× 1000
            <br/> * 1× 500
            <br/> * 1× 100
            <br/> * 1× 50
            <br/>
        </samp>
        <h1 id="types-of-bills">Available types of bills</h1>
        <ul>
            <li>1000
                <span id="bill2000"></span>
            </li>
            <li>500
                <span id="bill500" </span>
            </li>
            <li>100
                <span id="bill100" </span>
            </li>
            <li>50
                <span id="bill50" </span>
            </li>
        </ul>
        <aside>
            Note : if the amount can’t be fully split into bills, show an error message.
        </aside>
    </section>
    <section>
        <h1>Your solution</h1>
        <form>
            <input type="number" id="amount"></input>
            <button type="button" id="bogo">Submit</button>
        </form>
    </section>
    <!-- <div id="out"></div> -->
    <p id="output"></p>
</body>
</html>