You are using the jQuery libs however you never include them in the code.
You can include them with the following line:
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
Make sure to load jQuery BEFORE your js. Final code should be:
<head>
<link type="text/css" rel="stylesheet" href="https://stackoverflow.com/questions/29436335/css/main.css"/>
<script type="text/javascript" src="https://code.jquery.com/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="https://stackoverflow.com/questions/29436335/js/main.js"></script>
<title>Honeydukes</title>
</head>
2
solved JavaScript won’t work when loaded in HTML