ons-navigatorが上手く機能しません。

###前提・実現したいこと
ons-navigatorを使ってページを移動したいです。確認なのですが、AngularJSで書いてるつもりです。

###発生している問題・エラーメッセージ
jQueryを使いたく読み込み（<head>の部分に<script>を書き、</body>の手前にjsファイルを読み込む）を行った後に今まで動いていたons-navigatorが作動しなくなりました。

###該当のソースコード

html
1<!DOCTYPE HTML>
2<html>
3<head>
4  <meta charset="utf-8">
5  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
6  <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
7  <script src="components/loader.js"></script>
8  <script src="lib/angular/angular.min.js"></script>
9  <script src="lib/onsenui/js/onsenui.min.js"></script>
10  <script src="lib/onsenui/js/angular-onsenui.min.js"></script>
11
12  <link rel="stylesheet" href="components/loader.css">
13  <link rel="stylesheet" href="lib/onsenui/css/onsenui.css">
14  <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css">
15  <link rel="stylesheet" href="css/style.css">
16
17  <script>
18    ons.bootstrap()
19      .controller('AppController', function($scope) {
20        this.load = function(page) {
21          $scope.splitter.content.load(page);
22          $scope.splitter.left.close();
23        };
24
25        this.toggle = function() {
26          $scope.splitter.left.toggle();
27        };
28      })
29
30      .controller("TestController",function(){
31        this.pushPage = function() {
32          myNavigator.pushPage('food.html');
33        };
34      });
35
36    ons.ready(function() {
37        console.log("Onsen UI is ready!");
38    });
39  </script>
40   <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
41   <script>
42   var myNavigator = document.querySelector("#myNavigator");    
43   </script>
44</head>
45<body>
46
47<ons-navigator var="myNavigator"  page="mainmenu.html">
48</ons-navigator>
49
50
51
52<ons-template id="mainmenu.html">
53
54  <ons-splitter ng-controller="AppController as app" var="splitter">
55    <ons-splitter-side side="left" width="220px" collapse swipeable>
56      <ons-page>
57        <ons-list>
58          <ons-list-item ng-click="app.load('morning.html')" tappable>
59            朝
60          </ons-list-item>
61          <ons-list-item ng-click="app.load('noon.html')" tappable>
62            昼
63          </ons-list-item>
64          <ons-list-item ng-click="app.load('night.html')" tappable>
65            夜
66          </ons-list-item>
67        </ons-list>
68      </ons-page>
69    </ons-splitter-side>
70    <ons-splitter-content page="morning.html"></ons-splitter-content>
71  </ons-splitter>
72
73</ons-template>
74
75
76  <ons-template id="morning.html">
77    <ons-page ng-controller="TestController as test">
78      <ons-toolbar>
79        <div class="left">
80          <ons-toolbar-button ng-click="app.toggle()">
81            <ons-icon icon="md-menu"></ons-icon>
82          </ons-toolbar-button>
83        </div>
84        <div class="center">
85          朝
86        </div>
87      </ons-toolbar>
88      <ons-button ng-click="test.pushPage()">
89        朝食
90      </ons-button>
91    </ons-page>
92  </ons-template>
93  
94  <ons-template id="noon.html">
95    <ons-page>
96      <ons-toolbar>
97        <div class="left">
98          <ons-toolbar-button ng-click="app.toggle()">
99            <ons-icon icon="md-menu"></ons-icon>
100          </ons-toolbar-button>
101        </div>
102        <div class="center">
103          昼
104        </div>
105      </ons-toolbar>
106    </ons-page>
107  </ons-template>
108
109  <ons-template id="night.html">
110    <ons-page>
111      <ons-toolbar>
112        <div class="left">
113          <ons-toolbar-button ng-click="app.toggle()">
114            <ons-icon icon="md-menu"></ons-icon>
115          </ons-toolbar-button>
116        </div>
117        <div class="center">
118          夜
119        </div>
120      </ons-toolbar>
121    </ons-page>
122   
123  </ons-template>
124  
125 
126</body>
127</html>

html
1<!DOCTYPE HTML>
2<html>
3<head>
4    <meta charset="utf-8">
5    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no">
6    <meta http-equiv="Content-Security-Policy" content="default-src *; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
7    <link rel="stylesheet" href="components/loader.css">
8    <script src="components/loader.js"></script>
9    <script src="lib/angular/angular.min.js"></script>
10    <script src="lib/onsenui/js/onsenui.min.js"></script>
11    <script src="lib/onsenui/js/angular-onsenui.min.js"></script>
12    
13    <link rel="stylesheet" href="components/loader.css">
14    <link rel="stylesheet" href="lib/onsenui/css/onsenui.css">
15    <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css">
16    <link rel="stylesheet" href="css/style.css">
17    <script>
18        ons.bootstrap()
19      .controller('AppController', function($scope) {
20        this.load = function(page) {
21          $scope.splitter.content.load(page);
22          $scope.splitter.left.close();
23        };
24
25        this.toggle = function() {
26          $scope.splitter.left.toggle();
27        };
28      })
29
30      .controller("TestController",function(){
31        this.pushPage = function() {
32          myNavigator.pushPage("food.html");
33        };
34      });
35
36    ons.ready(function() {
37        console.log("Onsen UI is ready!");
38    });
39    
40    
41    </script>
42    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
43    <script>
44        var myNavigator = document.querySelector("#myNavigator");
45    </script>
46    
47    
48</head>
49<body>
50<ons-navigator var="myNavigator"  page="mainmenu.html">
51</ons-navigator>
52
53    
54
55<ons-template id="mainmenu.html">
56
57  <ons-splitter ng-controller="AppController as app" var="splitter">
58    <ons-splitter-side side="left" width="220px" collapse swipeable>
59      <ons-page>
60        <ons-list>
61          <ons-list-item ng-click="app.load('foodlist.html')" tappable>
62            朝
63          </ons-list-item>
64          <ons-list-item ng-click="app.load('noon.html')" tappable>
65            昼
66          </ons-list-item>
67          <ons-list-item ng-click="app.load('night.html')" tappable>
68            夜
69          </ons-list-item>
70        </ons-list>
71      </ons-page>
72    </ons-splitter-side>
73    <ons-splitter-content page="foodlist.html"></ons-splitter-content>
74  </ons-splitter>
75
76</ons-template>
77
78
79<ons-template id="foodlist.html">
80 <ons-page ng-controller="TestController as test">
81     <ons-toolbar>
82         <div class="left">
83          <ons-toolbar-button ng-click="app.toggle()">
84            <ons-icon icon="md-menu"></ons-icon>
85          </ons-toolbar-button>
86        </div>
87        <div class="center">
88          朝
89        </div>
90     </ons-toolbar>
91     
92    <div class="contents">
93         
94     <div class="outputlists">
95         ます
96     </div>
97     
98    </div>
99 </ons-page>
100 
101</ons-template> 
102
103<script src="lib/onsenui/js/memo.js"></script>
104</body>
105</html>
106