Added "Preview" button and listener

Added related output/CSS rules

demo/css/demo.css

@@ -1,9 +1,9 @@
 body {
+  font-family: sans-serif;
   margin: 2px;
 }
 
 form {
-  font-family: sans-serif;
   margin: 10% auto 0 auto;
   width: 380px;
 }
@@ -45,3 +45,29 @@ form textarea {
 form .textmarked {
   margin: 5px 0;
 }
+
+#output {
+  border-top: 1px solid #bbb;
+  height: 400px;
+  margin-top: 50px;
+  padding: 20px 10px 10px 10px;
+}
+
+#output * {
+  margin: 0;
+  padding: 0;
+}
+
+#output blockquote {
+  background-color: #eee;
+  color: #555;
+  border-left: 2px solid #999;
+  font-style: italic;
+  margin: 10px 5px;
+  padding: 10px;
+}
+
+#output code {
+  background-color: #eee;
+  color: #555;
+}

demo/index.html

@@ -30,11 +30,22 @@
 
         var textarea = document.getElementById('comments');
 
-        textMarked(textarea, settings).focus();
+        var editor = textMarked(textarea, settings);
+        editor.focus();
 
-        var button = document.getElementById('toggle-button');
+        var output = document.getElementById('output');
 
-        button.addEventListener('click', event => {
+        var previewButton = document.getElementById('preview-button');
+
+        previewButton.addEventListener('click', event => {
+          event.preventDefault();
+
+          output.innerHTML = editor.markup();
+        });
+
+        var toggleButton = document.getElementById('toggle-button');
+
+        toggleButton.addEventListener('click', event => {
           event.preventDefault();
 
           var field1 = document.querySelector('#comments');
@@ -59,6 +70,7 @@
     <form>
       <fieldset>
         <legend>
+          <button id="preview-button">Preview</button>
           <button id="toggle-button">Toggle</button>
         </legend>
 
@@ -71,5 +83,7 @@
 
       <input type="Reset" />
     </form>
+
+    <div id="output"></div>
   </body>
 </html>