--- a/parser-demo.js	Sat May 30 16:08:25 2009 -0700
+++ b/parser-demo.js	Sat May 30 16:38:20 2009 -0700
@@ -42,27 +42,31 @@
 
 $(window).ready(
   function() {
-    function print(text) {
-      var node = document.createTextNode(text.toString() + '\n');
-      $('.output').append(node);
-    }
-
     var code = $('.input').text();
     var tokens = Parsing.tokenize({lexicon: MyLexicon,
                                    text: code});
 
-    function printTokens(tokens) {
-      tokens.forEach(
-        function(token) {
-          var repr = token.name;
-          if (token.value)
-            repr += ":" + token.value;
-          repr += " @L" + token.lineNo + ":" + token.charNo;
-          print(repr);
-        });
-    }
+    jQuery.each(
+      tokens,
+      function() {
+        var token = this;
+        var node = $('<span class="token"></span>');
+        node.text(token.value);
+        node.hover(
+          function onIn() {
+            var overlay = $('<div class="overlay"></div>');
+            overlay.text(token.name);
+            overlay.css({left: $(this).position().left});
+            $(this).append(overlay);
+            $(this).addClass("highlight");
+          },
+          function onOut() {
+            $(".overlay", this).remove();
+            $(this).removeClass("highlight");
+          });
+        $('.tokenization').append(node);
+      });
 
-    printTokens(tokens);
     var parser = new Parsing.Parser(tokens);
-    print(parser.parse());
+    $('.parse-tree').text(parser.parse().toString());
   });