Even simpler rivets.js fiddle

keypath problem with rivets.js

HTML

<script src="https://rawgit.com/mikeric/rivets/master/dist/rivets.bundled.min.js"></script>
<p>
  The color of the menu item is supposed to change when clicked.<br/>
  But that's not happening, because the adapter does not return a value from the model when get is being invoked on the keypath "menu.item".
</p>
<ul id="menu">
  <li>
    <a href="#" role="button"  rv-class-enabled="menu.item" rv-select="menu.item">
      Menu Item 1
		 </a>	
	</li>
</ul>

CSS

#menu .enabled {
		background-color: green;
		color: white;
}

JavaScript

rivets.binders.select = {
	  publishes: true,
    bind: function(el) {

        var self    = this;
        
        this.callback = function(ev) {
        	  ev.preventDefault();
          	var value = self.observer.value();

          	var newValue = !value;
            
            self.observer.setValue(newValue);
        };
        el.addEventListener('click', this.callback);
    },
    unbind: function(el, value) {			    	
      	el.removeEventListener('click', this.callback);
    }
};

var menu = document.querySelector("#menu"); 
rivets.bind(menu, { 
    menu: {
        item: false
  	}
});