propを使用し、ボタンを有効化したり無効化したりしたい。

下記のサイトを参考にし、ボタンを無効化したり有効化したりしたいのですが、チェックボックスにチェックを入れてもボタンに変化がありません。

html
1<!DOCTYPE html>
2<html lang="ja">
3  <head>
4    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
5    <meta name="description" content="このページの説明文">
6    <title>このページのタイトル</title>
7    <link rel="stylesheet" href="/main.css">
8    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
9    <script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js'></script>
10    <script>
11    $('#check').change(function() {
12    // チェックが入っていたら有効化
13    if ( $(this).is(':checked') ){ 
14        // ボタンを有効化
15        $('#button').prop('disabled', false);
16    } else { 
17        // ボタンを無効化
18        $('#button').prop('disabled', true); 
19    }
20      });
21    </script>
22  </head>
23  <body>
24    <input id="check" type="checkbox" />チェックしてください<br>
25    <button id="button" disabled="disabled">送信</button>
26  </body>
27</html>