JSFiddle - React, Tailwind, and code Playground

HTML

<script id='template' type='text/ractive'>
    <input value='{{foo}}'>
    {{> paging(foo) }}
       
</script>

JavaScript

var r = new Ractive({
    el: document.body,
    template: '#template',
    data: {
        foo: 'foo',
        paging: function(x){
            var template = '<li on-click="clicked()">' + x + '</li>';
            if (!this.partials.paging) {
                this.partials.paging = template;
            }
            else {
                this.resetPartial('paging', template);
            }
            return 'paging';
        }
    },
    clicked: function(){
        alert('clicked!')
    }
});