JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cloud.github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<script src="http://documentcloud.github.com/underscore/underscore.js"></script>
<ul data-bind="foreach: all">
    <li>
        <span data-bind="text: id"></span>
        <span data-bind="visible: isSelected">(selected)</span>
    </li>
</div>

JavaScript

function Item(id, panel) {
    var that = this;
    this.id = id;
    this.viewModel = panel;
    this.isSelected = ko.computed(function(){
        return panel.isSelected(that);
    });
}

function Panel() {
    var that = this;
    
    //my two lists
    this.all = ko.observableArray();
    this.selected = ko.observableArray();
                                      
    this.isSelected = function(item){
        return _(that.selected()).find(function(thing){
            console.log("iterating");
            return thing.id == item.id;
        });
    };
}

var panel = new Panel();
ko.applyBindings(panel);

//add some things to the list
for(var i=0; i<40; i++){
    var item = new Item(i, panel)
    panel.all.push(item);
    //let's select some of them. note it's actually a different object
    if (i % 2 == 0){
        panel.selected.push(new Item(i, panel));
    }
};