JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<div id="knockout">
    <div>Look below:</div>
    <div>
        <!-- ko template: {foreach: items, afterRender: fadeIn} -->
        <div class="hidden">fade me in aoutomatically</div>
        <!-- /ko -->
        <a href="#" data-bind="click: add">Add</a>&nbsp;<a href="#" data-bind="click: pop">Pop</a>
    </div>
</div>

CSS

.hidden {
    display: none;
}

JavaScript

var MyViewModel = {
    items: ko.observableArray([]),
    fadeIn: function (element) {
        console.log(element);
        $(element[1]).fadeIn();
    },
    add: function () {
        this.items.push("fade me in aoutomatically");
    },
    pop: function () {
        this.items.pop();
    }
};
ko.applyBindings(MyViewModel, $("#knockout")['0']);