exercise3.html

<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <title>Föli buses and routes</title>
    <link rel="stylesheet" href="exercise3.css">
    <script src="exercise3.js" type="text/javascript"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script async defer src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCUhNGmsd4L3YF80Bv3jEOOanVgfrE2dYQ&callback=initMap"></script>
</head>

<body>
<div id="page">
    <div id="titlebar">
        <p id="paragraphtitle">Föli buses and routes</p>
    </div>
    <div id="content">
        <form id="lineForm">
            <label for="lineList">Select bus line</label>
            <select name="lineList" id="lineList">
                <option value="" disabled selected>Select line</option>
            </select>
            <input type="button" value="Show buses" id="busButton">
            <input type="button" value="Refresh" id="refreshButton">
            <input type="button" value="Show route" id="routeButton">
        </form>
        <div id="mapWrap">
            <div id="map" style="width:100%;height:600px;"></div>
        </div>
    </div> 
</div>
       
</body>
</html>