SyntaxError: Unexpected token u Angularjs - angularjs

Question

//Define angular app
var app = angular.module('ToDoApp', []);
//controllers
app.controller('taskController', function($scope) {
$scope.today = new Date();
$scope.saved = localStorage.getItem('taskItems');
$scope.taskItem = (localStorage.getItem('taskItems') !== null) ?
JSON.parse($scope.saved) : [{
description: "Why not add a task?",
date: $scope.today,
complete: false
}];
localStorage.setItem('taskItems', JSON.stringify($scope.taskItem));
$scope.newTask = null;
$scope.newTaskDate = null;
$scope.categories = [{
name: 'Personal'
}, {
name: 'Work'
}, {
name: 'School'
}, {
name: 'Cleaning'
}, {
name: 'Other'
}];
$scope.newTaskCategory = $scope.categories;
$scope.addNew = function() {
if ($scope.newTaskDate == null || $scope.newTaskDate == '') {
$scope.taskItem.push({
description: $scope.newTask,
date: "No deadline",
complete: false,
category: $scope.newTaskCategory.name
})
} else {
$scope.taskItem.push({
description: $scope.newTask,
date: $scope.newTaskDate,
complete: false,
category: $scope.newTaskCategory.name
})
};
$scope.newTask = '';
$scope.newTaskDate = '';
$scope.newTaskCategory = $scope.categories;
localStorage.setItem('taskItems', JSON.stringify($scope.taskItem));
};
$scope.deleteTask = function() {
var completedTask = $scope.taskItem;
$scope.taskItem = [];
angular.forEach(completedTask, function(taskItem) {
if (!taskItem.complete) {
$scope.taskItem.push(taskItem);
}
});
localStorage.setItem('taskItems', JSON.stringify($scope.taskItem));
};
$scope.save = function() {
localStorage.setItem('taskItems', JSON.stringify($scope.taskItem));
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="ToDoApp">
<div class="container">
<div class="content" ng-controller="taskController">
<h1>Welcome to your to do List</h1>
<p class="tagline">By Flintdesignz
</p>
<form>
<div class="row">
<div class="inputContainer">
<input type="text" id="description" class="taskName" placeholder="I need to..." ng-model="newTask">
</div>
</div>
<div class="row">
<div class="inputContainer"> <i class="fa fa-caret-down selectArrow"></i>
<select id="category" class="taskCategory" ng-model="newTaskCategory" ng-options="obj.name for obj in categories">
<option class="disabled" value="">Category</option>
</select>
</div>
</div>
<div class="row">
<div class="inputContainer">
<input type="date" id="dueDate" class="taskDate" ng-model="newTaskDate">
</div>
</div>
<div class="row buttons_holder">
<button class="taskAdd" ng-click="addNew()"><i class="fa fa-plus icon"></i>Add task</button>
<button class="taskDelete" ng-click="deleteTask()"><i class="fa fa-trash-o icon"></i>Remove Tasks</button>
</div>
</form>
<!-- TaskList Starts Here -->
<ul class="taskList">
<li class="taskItem" ng-repeat="taskItem in taskItem track by $index" ng-model="taskItem">
<input type="checkbox" class="taskCheckbox" ng-model="taskItem.complete" ng-change="save()">
<span class="complete-{{taskItem.complete}}">{{taskItem.description}}</span> <span class="category-{{taskItem.category}}">{{taskItem.category}}</span> <strong class="taskDate complete-{{taskItem.complete}}"><i class="fa fa-calendar"></i>{{taskItem.date | date : 'mediumDate'}}</strong>
</li>
</ul>
<!-- TaskList Ends HEre -->
</div>
<!-- Content Ends Here -->
</div>
<!-- container -->
</div>
Building a Todo App that adds tasks and deletes them aswell and getting the above error. Below is my html and my angular code. I have checked other blogs and still no valid answer.