diff --git a/static/js/file_reader.js b/static/js/file_reader.js
index cb0126d..41703d7 100644
--- a/static/js/file_reader.js
+++ b/static/js/file_reader.js
@@ -1,21 +1,61 @@
-function sortByTitle() {
-    var sort_by_title = function (a, b) {
-        let x = a.getElementsByClassName('card-title')[0];
-        let y = b.getElementsByClassName('card-title')[0];
-        console.log(x);
-        return x.innerHTML.toLowerCase().localeCompare(y.innerHTML.toLowerCase());
-    };
+function updateParent(notesArr) {
+    let parent = document.getElementById('sortable-wrapper');
+    parent.innerHTML = '';
+    for (let elem of notesArr) {
+        parent.appendChild(elem);
+    }
+}
 
+function convertToArray() {
     var notes = document.getElementsByClassName("sortable");
     var notesArr = [];
     for (const node of notes) {
         notesArr.push(node);
     }
-    console.log(notesArr);
+    return notesArr;
+}
+
+function sortByTitle() {
+    var sort_by_title = function (a, b) {
+        let x = a.getElementsByClassName('card-title')[0];
+        let y = b.getElementsByClassName('card-title')[0];
+        return x.innerHTML.toLowerCase().localeCompare(y.innerHTML.toLowerCase());
+    };
+
+    var notesArr = convertToArray();
     notesArr.sort(sort_by_title);
-    console.log(notesArr);
-    let parent = document.getElementById('sortable-wrapper');
-    for (let elem of notesArr) {
-        parent.appendChild(elem);
-    }
+    updateParent(notesArr);
+}
+
+function sortByDate() {
+    console.log('Sort Date');
+    var sort_by_date = function (a, b) {
+        a = a.getElementsByClassName('date')[0];
+        b = b.getElementsByClassName('date')[0];
+        if (a && b) {
+            a = a.innerHTML.split(' ');
+            let a_date = a[0].split('.');
+            let a_time = a[1].split(':');
+            b = b.innerHTML.split('\ ');
+            let b_date = b[0].split('.');
+            let b_time = b[1].split(':');
+            let x = new Date(a_date[2], a_date[1], a_date[0], a_time[0], a_time[1]).getTime();
+            let y = new Date(b_date[2], b_date[1], b_date[0], b_time[0], b_time[1]).getTime();
+            if (x === y) {
+                return 0;
+            } else if (x > y) {
+                return -1;
+            } else {
+                return 1;
+            }
+        } else {
+            return 0;
+        }
+
+        // return x.innerHTML.toLowerCase().localeCompare(y.innerHTML.toLowerCase());
+    };
+
+    var notesArr = convertToArray();
+    notesArr.sort(sort_by_date);
+    updateParent(notesArr);
 }
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index b1ed77e..7a928ea 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -16,6 +16,7 @@
     <div class="row">
         <div class="col">
             <button class="btn btn-success" onclick="sortByTitle()">Sort By Title</button>
+            <button class="btn btn-success" onclick="sortByDate()">Sort By Date</button>
         </div>
     </div>
     <div id="sortable-wrapper" class="row">
@@ -27,8 +28,7 @@
                     <div class="card-body">
                         <h5 class="card-title">{{note[1]}}</h5>
                         {% if note[5] %}
-                        <h6 class="card-subtitle mb-2 text-muted">LastChanged: {{note[5].strftime('%d.%m.%Y
-                            %H:%M')}}</h6>
+                        <h6 class="card-subtitle mb-2 text-muted">LastChanged: <span class="date">{{note[5].strftime('%d.%m.%Y %H:%M')}}</span></h6>
                         {% endif %}
                         <p class="card-text">ViewCount: {{note[4]}}</p>
                     </div>