Ractive + Jquery Mobile

HTML

<script src="http://www.ractivejs.org/examples/lib/Ractive.js"></script>
<div data-role="page" id="somepage">
    <div data-role="header">
         <h1>Prueba</h1>

    </div>
    <div data-role="content">
        <input type="text" value="{{username}}" />
        {{#username}}
        <p>Hello {{username}}! You have {{msgCount}} new messages.</p>
        {{/username}}
    </div>
</div>

JavaScript

(function ($) {

    $.fn.ractiveView = function (model, reload) {
        var $that = this;
        var view = $that.data("ractive.view");
        var templateStr = $that.data("ractive.template");

        if (!view || reload) {
            if (!templateStr) {
                templateStr = $that.html();
                $that.data("ractive.template", templateStr);
            }
            var model = $.extend({}, model);
            
            view = new Ractive({
                el: $that[0],
                template: templateStr,
                data: model
            });
            
            view.on("set", function(){
                $that.find("select").selectmenu( "refresh" );
            });
            
            $that.data("ractive.view", view);
        }

        return view;
    };

})(jQuery);

$(function () {
    $("#somepage").ractiveView().set({
        username: "Sergio",
        msgCount: 2
    });
});