JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/Ripple.js/1.2.1/ripple.min.js"></script>
<script src="https://rawgithub.com/ripplejs/events/master/dist/ripple-events.min.js"></script>
<script type="text/template" id="template">
<p on-click="{{ this.toggle }}">
You {{ liked ? "like" : "unlike"}} this. Click to toggle
</p>
</script>
JavaScript
var LikeButton = ripple('#template').use(ripple.events);
LikeButton.on('created', function(button){
button.set('liked', false);
});
LikeButton.prototype.toggle = function(){
this.set('liked', !this.data.liked);
};
var button = new LikeButton();
button.appendTo(document.body);