JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/ractive/0.7.3/ractive.min.js"></script>
<strong>
Event listener lost with triple-stash rendering
</strong>
<div id='container'></div>
<script id="template" type="x-template">
<p>
<a on-click="handleClick">
I can be clicked!
</a>
</p>
<p>
{{{clickylink}}}
</p>
</script>
JavaScript
var app = new Ractive({
el: 'container',
template: '#template',
data: {
clickylink: '<a on-click="handleClick">I can not be clicked!</a>'
}
});
app.on({
handleClick: function() {
alert('clicked!');
}
});