JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/ink/2.2.1/js/ink-all.js"></script>
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/ink/2.2.1/css/ink.css">
<ul class="ink-tree-view" id="treeview">
  <li class="open"><span></span><a href="#">root</a>
    <ul>
      <li><a href="">child 1</a></li>
      <li><span></span><a href="#">child 2</a>
        <ul>
          <li><a href="">grandchild 2a</a></li>
          <li><span></span><a href="#">grandchild 2b</a>
            <ul>
              <li><a href="">grandgrandchild 1bA</a></li>
              <li><a href="">grandgrandchild 1bB</a></li>
            </ul>
          </li>
        </ul>
      </li>
      <li><a href="">child 3</a></li>
    </ul>
  </li>
</ul>

JavaScript

/**
 * @module Ink.UI.TreeView_1
 * @author inkdev AT sapo.pt
 * @version 1
 */
Ink.createModule('Ink.UI.TreeView', '1', ['Ink.UI.Aux_1', 'Ink.Dom.Event_1', 'Ink.Dom.Css_1', 'Ink.Dom.Element_1', 'Ink.Dom.Selector_1', 'Ink.Util.Array_1'], function(Aux, Event, Css, Element, Selector, InkArray) {
  'use strict';
  var TreeView = function(selector, options) {

    /**
     * Gets the element
     */
    if (!Aux.isDOMElement(selector) && (typeof selector !== 'string')) {
      throw '[Ink.UI.TreeView] :: Invalid selector';
    } else if (typeof selector === 'string') {
      this._element = Selector.select(selector);
      if (this._element.length < 1) {
        throw '[Ink.UI.TreeView] :: Selector has returned no elements';
      }
      this._element = this._element[0];
    } else {
      this._element = selector;
    }

    /**
     * Default options and they're overrided by data-attributes if any.
     * The parameters are:
     * @param {string} node Selector to define which elements are seen as nodes. Default: li
     * @param {string} child Selector to define which elements are represented as childs. Default: ul
     */
    this._options = Ink.extendObj({
      node: 'li:not(.open)',
      child: 'ul',
      closedClass: 'closed',
      openClass: 'open',
      parentClass: 'parent',
      hideClass: 'hide-all'

    }, Element.data(this._element));

    this._options = Ink.extendObj(this._options, options || {});

    this._init();
  };

  TreeView.prototype = {

    /**
     * Init function called by the constructor. Sets the necessary event handlers.
     * 
     * @method _init
     * @private
     */
    _init: function() {

      this._handlers = {
        click: Ink.bindEvent(this._onClick, this)
      };

      Event.observe(this._element, 'click', this._handlers.click);

      var
        nodes = Selector.select(this._options.node, this._element),
        children;
      InkArray.each(nodes, Ink.bind(function(item) {

        Css.addClassName(item,...