Shadow root manipulation with jQuery

HTML

<script src="http://miksovsky.com/projects/jquery/jquery.js"></script>
<p>
In a Shadow DOM-capable browser (currently, Google Canary), you should see the word "Hello" before the names below.
</p>

<div is="Greet">Ann</div>
<div is="Greet">Bob</div>
<div is="Greet">Carol</div>

CSS

body {
    font-family: Helvetica, sans serif;
}

JavaScript

window.Greet = function( host ) {
    var root = host.createShadowRoot();
    // The next line depends on a fix for $.html() to support
    // setting innerHTML on Shadow DOM roots. If you remove the
    // fiddle's reference to a private build of jQuery (in the
    // "Manage Resources" panel to the left, and instead load the
    // production jQuery 1.9 release (under "Choose Framework"),
    // the fiddle will stop working.
    $( root ).html(
        "<div>Hello, <content></content>.</div>"
    );
};

$( function() {
    // Create components for all elements with "is" attribute.
    $( "[is]" ).each( function( index, element ) {
        var componentClassName = $( element ).attr( "is" );
        var classFn = window[ componentClassName ];
        if ( classFn ) {
            new classFn( element );
        }
    });
});