Knockoutjs zebra example

info page : http://knockoutjs.com/documentation/binding-context.html

by linuxbender

HTML

<script src="https://raw.github.com/SteveSanderson/knockout/master/build/output/knockout-latest.debug.js"></script>

<ul data-bind="foreach: myList">
    <li data-bind="css: { 'even': ($index() % 2 == 0) }">
        The value is <span data-bind="text: $data"></span>
    </li>
</ul>

CSS

.even {
    background-color: #f6f6f6;
}

JavaScript

var ViewModel = function(){       
    this.myList = ko.observableArray(['cats', 'dogs', 'fish','flower','tree']);
    
               
};

ko.applyBindings(new ViewModel());