Using Textbox.io - selector filters

HTML

<script src="https://s3.amazonaws.com/static.ephox.com/jsfiddle/textboxio/textboxio.js"></script>
<div id="editableDiv">
</div>

CSS

#editableDiv {
    margin:10px 0;
    height:200px;
}

JavaScript

var ed = textboxio.replace('#editableDiv');

/* Our filter function. This gets executed with a list of elements that match
 * our selector
 */
var makeRed = function (elements) {
 elements.forEach(function (el) {
        // use jQuery to make the element red
        $(el).css({color:'yellow'});
 });
};

// execute the function for all h1 tags. You can use any Jquery-style selector as 
// the first argument
ed.filters.selector.addInput('h1', makeRed); 

// Test it by setting some content that contains 'h1' tags.
ed.content.set('<h1> this is my heading</h1><p>and this is a paragraph</p>');