todo.html

<!-- This is just going to be a mediocre To-Do list. -->

<!DOCTYPE html>
<html>
    <head>
        <title>To-Do List</title>
        <link rel="stylesheet" href="todo.css">
    </head>
    <body>
        <div class="toDoList">
            <h4>To-Do List</h4>
            <form target="_self"> <!-- This is so that the submitted information doesn't go anywhere but to the current page. -->
                <input type="text" name="toDoList" placeholder="To-Do" id="textBox">
                <input type="submit" value="Add" onclick="newElement()" id="ToDoButton">
                    <!-- newElement() is a JS function that will add the information in the search bar to the unordered list below. -->
            </form>
        </div>
        <section id="main">
            Tasks:
            <ul id = "list">
                <!-- These are dummy values for the unordered list. The idea
                is that the next item should be placed beneath them. -->
                <li>test1</li>
                <li>test2</li>
                <li>test3</li>
            </ul>
        </section>
        <script type="text/javascript" src="todo.js"> </script>
    </body>
</html>