diff --git a/dev/demo/matchdemo.js b/dev/demo/matchdemo.js
index adac3c4..9d2d915 100644
--- a/dev/demo/matchdemo.js
+++ b/dev/demo/matchdemo.js
@@ -49,7 +49,7 @@
   "  </span>" +
   "</span>";
 
-var treeSnippet =
+  var treeSnippet =
   "<span class=\"context-left\"></span>" +
   "<span class=\"match\">" +
   "  <span title=\"xip/c:MC\">" +
@@ -64,13 +64,15 @@
   "        </span>" +
   "      </span>" +
   "      <span title=\"xip/c:VERB\">ist</span>" +
-  "      <span title=\"xip/c:NP\">" +
-  "        <span title=\"xip/c:PRON\">es</span>" +
-  "      </span>" +
-  "      <span title=\"xip/c:AP\">" +
-  "        <span title=\"xip/c:ADV\">nun</span>" +
-  "        <span title=\"xip/c:ADJ\">möglich</span>" +
-  "      </span>" +
+  "      <mark>" +
+  "        <span title=\"xip/c:NP\">" +
+  "          <span title=\"xip/c:PRON\">es</span>" +
+  "        </span>" +  
+  "        <span title=\"xip/c:AP\">" +
+  "          <span title=\"xip/c:ADV\">nun</span>" +
+  "          <span title=\"xip/c:ADJ\">möglich</span>" +
+  "        </span>" +
+  "      </mark>" +
   "      <span title=\"xip/c:ADV\">z. B.</span>" +
   "      <span title=\"xip/c:NPA\">" +
   "        <span title=\"xip/c:NP\">" +
@@ -106,7 +108,7 @@
   "</span>" +
   "<span class=\"context-right\"></span>";
 
-  var treeSnippet = "<span class=\"context-left\"><\/span><span class=\"match\">In diesem <span title=\"cnx\/c:np\">Sinne<\/span> schrieb <span title=\"cnx\/c:np\">Brunschwicg<\/span>:&quot;In <span title=\"cnx\/c:np\">Euklids<\/span> <span title=\"cnx\/c:np\">Elementen<\/span> <span title=\"cnx\/c:np\">spiegel<\/span> sich die <span title=\"cnx\/c:np\">Resultate<\/span> der <span title=\"cnx\/c:np\">Arbeit von Generationen vor Aristoteles<\/span> wider, nicht nur die <span title=\"cnx\/c:np\">technische Arbeit<\/span> der <span title=\"cnx\/c:np\">Entdecklung<\/span>, sondern auch die <span title=\"cnx\/c:np\">methodologische Arbeit<\/span> der <span title=\"cnx\/c:np\">Verbindung<\/span> und des <span title=\"cnx\/c:np\">Beweises<\/span>, die, in der <span title=\"cnx\/c:np\">Schule<\/span> des <span title=\"cnx\/c:np\">Phythagoras<\/span> begonnen, ihre <span title=\"cnx\/c:np\">Vollendung in den Schulen von Eudoxos von Cnidus<\/span> und <span title=\"cnx\/c:np\">Platon<\/span> gefunden hat&quot;(5<\/span><span class=\"context-right\"><\/span>";
+//  var treeSnippet = "<span class=\"context-left\"><\/span><span class=\"match\">In diesem <span title=\"cnx\/c:np\">Sinne<\/span> schrieb <span title=\"cnx\/c:np\">Brunschwicg<\/span>:&quot;In <span title=\"cnx\/c:np\">Euklids<\/span> <span title=\"cnx\/c:np\">Elementen<\/span> <span title=\"cnx\/c:np\">spiegel<\/span> sich die <span title=\"cnx\/c:np\">Resultate<\/span> der <span title=\"cnx\/c:np\">Arbeit von Generationen vor Aristoteles<\/span> wider, nicht nur die <span title=\"cnx\/c:np\">technische Arbeit<\/span> der <span title=\"cnx\/c:np\">Entdecklung<\/span>, sondern auch die <span title=\"cnx\/c:np\">methodologische Arbeit<\/span> der <span title=\"cnx\/c:np\">Verbindung<\/span> und des <span title=\"cnx\/c:np\">Beweises<\/span>, die, in der <span title=\"cnx\/c:np\">Schule<\/span> des <span title=\"cnx\/c:np\">Phythagoras<\/span> begonnen, ihre <span title=\"cnx\/c:np\">Vollendung in den Schulen von Eudoxos von Cnidus<\/span> und <span title=\"cnx\/c:np\">Platon<\/span> gefunden hat&quot;(5<\/span><span class=\"context-right\"><\/span>";
 
   KorAP.API.getMatchInfo = function(match, callObj, cb) {
     if (callObj["spans"] !== undefined && callObj["spans"] === true) {
diff --git a/dev/js/spec/matchSpec.js b/dev/js/spec/matchSpec.js
index 80690e5..f365045 100644
--- a/dev/js/spec/matchSpec.js
+++ b/dev/js/spec/matchSpec.js
@@ -82,13 +82,15 @@
   "        </span>" +
   "      </span>" +
   "      <span title=\"xip/c:VERB\">ist</span>" +
-  "      <span title=\"xip/c:NP\">" +
-  "        <span title=\"xip/c:PRON\">es</span>" +
-  "      </span>" +
-  "      <span title=\"xip/c:AP\">" +
-  "        <span title=\"xip/c:ADV\">nun</span>" +
-  "        <span title=\"xip/c:ADJ\">möglich</span>" +
-  "      </span>" +
+  "      <mark>" +
+  "        <span title=\"xip/c:NP\">" +
+  "          <span title=\"xip/c:PRON\">es</span>" +
+  "        </span>" +  
+  "        <span title=\"xip/c:AP\">" +
+  "          <span title=\"xip/c:ADV\">nun</span>" +
+  "          <span title=\"xip/c:ADJ\">möglich</span>" +
+  "        </span>" +
+  "      </mark>" +
   "      <span title=\"xip/c:ADV\">z. B.</span>" +
   "      <span title=\"xip/c:NPA\">" +
   "        <span title=\"xip/c:NP\">" +
@@ -393,8 +395,8 @@
       var info = matchClass.create(match).info();
       expect(info).toBeTruthy();
       info.getTree(undefined, undefined, function (treem) {
-	tree = treem;
-	done();
+	      tree = treem;
+	      done();
       });
     });
 
@@ -403,9 +405,9 @@
       expect(tree.nodes()).toEqual(49);
     });
 
-
-    var info, matchElement;
-    it('should parse into a tree view', function () {
+    var matchElement, info;
+    // var info, matchElement;
+    it('should parse into a tree view', function () {      
       matchElement = matchElementFactory();
       expect(matchElement.tagName).toEqual('LI');
 
@@ -435,7 +437,7 @@
     it('should add a tree view async 1', function (done) {
       expect(info).toBeTruthy();
       info.addTree('mate', 'beebop', function () {
-	done();
+	      done();
       });
     });
 
diff --git a/dev/js/src/match/tree.js b/dev/js/src/match/tree.js
index e45d05f..dcecd5e 100644
--- a/dev/js/src/match/tree.js
+++ b/dev/js/src/match/tree.js
@@ -59,12 +59,12 @@
       
       // This is a new root
       this._addNode(
-	this._next++,
-	{ "class" : "root" }
+	      this._next++,
+	      { "class" : "root" }
       );
       
       // Parse nodes from root
-      this._parse(0, html.childNodes);
+      this._parse(0, html.childNodes, undefined);
 
       // Root node has only one child - remove
       if (g.outEdges(0).length === 1)
@@ -86,6 +86,7 @@
       obj["width"]  = WIDTH;
       obj["height"] = HEIGHT;
       this._graph.setNode(id, obj)
+      return obj;
     },
     
     // Add new edge to graph
@@ -99,50 +100,62 @@
     },
 
     // Parse the snippet
-    _parse : function (parent, children) {
+    _parse : function (parent, children, mark) {
       for (var i in children) {
-	var c = children[i];
+	      var c = children[i];
 
-	// Element node
-	if (c.nodeType == 1) {
+	      // Element node
+	      if (c.nodeType == 1) {
 
-	  // Get title from html
-	  if (c.getAttribute("title")) {
-	    var title = this._clean(c.getAttribute("title"));
+	        // Get title from html
+	        if (c.getAttribute("title")) {
+	          var title = this._clean(c.getAttribute("title"));
 
-	    // Add child node
-	    var id = this._next++;
+	          // Add child node
+	          var id = this._next++;
 
-	    this._addNode(id, {
-	      "class" : "middle",
-	      "label" : title
-	    });
-	    this._addEdge(parent, id);
+	          var obj = this._addNode(id, {
+	            "class" : "middle",
+	            "label" : title
+	          });
+            
+            if (mark !== undefined) {
+              obj.class += ' mark';
+            };
+            
+	          this._addEdge(parent, id);
 
-	    // Check for next level
-	    if (c.hasChildNodes())
-	      this._parse(id, c.childNodes);
-	  }
+	          // Check for next level
+	          if (c.hasChildNodes())
+	            this._parse(id, c.childNodes, mark);
+	        }
 
-	  // Step further
-	  else if (c.hasChildNodes())
-	    this._parse(parent, c.childNodes);
-	}
+	        // Step further
+	        else if (c.hasChildNodes()) {
 
-	// Text node
-	else if (c.nodeType == 3)
+            if (c.tagName === 'MARK') {
+	            this._parse(parent, c.childNodes, true);
+            }
+            else {
+	            this._parse(parent, c.childNodes, mark);
+            };
+          };
+	      }
 
-	  if (c.nodeValue.match(/[-a-z0-9]/i)) {
+	      // Text node
+	      else if (c.nodeType == 3)
 
-	    // Add child node
-	    var id = this._next++;
-	    this._addNode(id, {
-	      "class" : "leaf",
-	      "label" : c.nodeValue
-	    });
+	        if (c.nodeValue.match(/[-a-z0-9]/i)) {
 
-	    this._addEdge(parent, id);
-	  };
+	          // Add child node
+	          var id = this._next++;
+	          this._addNode(id, {
+	            "class" : "leaf",
+	            "label" : c.nodeValue
+	          });
+
+	          this._addEdge(parent, id);
+	        };
       };
       return this;
     },
@@ -197,7 +210,7 @@
 	function (v) {
 	  v = g.node(v);
 	  var group = document.createElementNS(svgXmlns, 'g');
-	  group.classList.add(v.class);
+	  group.setAttribute('class', v.class);
 
 	  // Add node box
 	  var rect = group.appendChild(document.createElementNS(svgXmlns, 'rect'));
diff --git a/dev/scss/main/matchinfo.scss b/dev/scss/main/matchinfo.scss
index 709eef7..1050924 100644
--- a/dev/scss/main/matchinfo.scss
+++ b/dev/scss/main/matchinfo.scss
@@ -241,16 +241,33 @@
   fill: $middle-orange;
 }
 
+g.middle.mark {
+  rect {
+    fill: $darker-orange;
+  }
+  > text {
+    fill: $light-orange;
+    > tspan {
+      stroke: $light-orange;
+    }
+  }
+}
+
+
+g.leaf.mark text > tspan {
+  font-weight: bold;
+}
+
 g.leaf > rect {
   display: none;
 }
 
-g > text {
+g > text > tspan {
   text-anchor: middle;
   font-size: 9pt;
 }
 
-g.leaf > text {
+g.leaf > text > tspan {
   font-size: 10pt;
   overflow: visible;
 }