Knockout - observableArray.replace

http://stackoverflow.com/questions/6425409/how-to-replace-a-given-index-element-in-knockoutjs

HTML

<script src="https://github.com/downloads/SteveSanderson/knockout/knockout-2.0.0.js"></script>
<ul data-bind="foreach: colors">
    <li><span data-bind="text:color"></span>
    </li>
</ul>
<br/>
<span>New Color:</span><input type="text" data-bind="value:newColor"/>
<br/>
<span>Replace index (0 based):</span><input type="text" data-bind="value:index"/>
<br/>
<button data-bind="click:replaceIt">Replace It</button>

JavaScript

var ViewModel = function() {
    this.self = this;
    self.index = ko.observable(0); // default
    self.newColor = ko.observable("purple"); // default
    self.colors = ko.observableArray([{
        color: 'red'},
    {
        color: 'blue'},
    {
        color: 'yellow'}]);
    self.replaceIt = function() {
        self.colors.replace(self.colors()[self.index()], {
            color: self.newColor()
        });
        self.colors([{
        color: 'red'},
    {
        color: 'red'},
    {
        color: 'red'}])
    };
};
ko.applyBindings(new ViewModel());