diff --git a/public/static/css/styles.css b/public/static/css/styles.css
index 87b2f8a..13c32e9 100644
--- a/public/static/css/styles.css
+++ b/public/static/css/styles.css
@@ -142,6 +142,14 @@ hr{
 .noteContent {
     padding-top: 7px;
     font-size: 0.9em;
+    display: none;
+}
+
+.toggle{
+  height: 30px;
+  padding:1px;
+  margin-top:-30px;
+  float:right;
 }
 
 .notefooter{
diff --git a/public/static/js/script.js b/public/static/js/script.js
index ea61f16..d7d2439 100644
--- a/public/static/js/script.js
+++ b/public/static/js/script.js
@@ -40,5 +40,7 @@ $(document).ready(function(){
         }
      }
    );*/
-
+$('.toggle').click(function(){
+     $(this).next().toggle();
+   });
 });
diff --git a/public/templates/home.html b/public/templates/home.html
index 483d02f..4d256c4 100644
--- a/public/templates/home.html
+++ b/public/templates/home.html
@@ -34,8 +34,8 @@
   <div class="timeline">
     {{ if .Tasks}} {{range .Tasks}}
     <div class="note">
-      <p class="noteHeading">{{.Title}}</p>
-      <hr>
+      <p class="noteHeading">{{.Title}}</p> <button class="toggle btn btn-primary">toggle</button>
+
       <p class="noteContent">{{.Content}}</p>
       <span class="notefooter">
                     <ul class="menu">