HTML Materializeのドロップダウンメニューが出ない

MaterializeのドキュメントのNavbar Dropdown Menuを参考に、ドロップダウンメニューを作りたいのですが、書かれている通り(多分)に作っても、Dropdownをクリックしたときにメニューが表示されないです。
何が足りない、どこが悪いなど教えていただけますでしょうか？
よろしくお願いいたします。

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4    <meta charset="UTF-8">
5    <title>Materialize_sample</title>
6    <!-- Compiled and minified CSS -->
7    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/css/materialize.min.css">
8    <!-- Compiled and minified JavaScript -->
9    <script src="https://cdnjs.cloudflare.com/ajax/libs/materialize/1.0.0/js/materialize.min.js"></script>
10    <!--Import Google Icon Font-->
11    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
12</head>
13<body>
14    <!-- Dropdown Structure -->
15    <ul id="dropdown1" class="dropdown-content">
16        <li><a href="#!">one</a></li>
17        <li><a href="#!">two</a></li>
18        <li class="divider"></li>
19        <li><a href="#!">three</a></li>
20    </ul>
21    <nav>
22        <div class="nav-wrapper">
23            <a href="#!" class="brand-logo">Logo</a>
24            <ul class="right hide-on-med-and-down">
25                <li><a href="sass.html">Sass</a></li>
26                <li><a href="badges.html">Components</a></li>
27                <!-- Dropdown Trigger -->
28                <li><a class="dropdown-trigger" href="#!" data-target="dropdown1">Dropdown<i class="material-icons right">arrow_drop_down</i></a></li>
29            </ul>
30        </div>
31    </nav>
32    <script>
33        $(document).ready(function () {
34            $(".dropdown-trigger").dropdown();
35        });
36    </script>
37</body>
38</html>