Edit in JSFiddle

<h3>Products</h3>

<ul class="prods" data-bind="foreach: products">
    <li>
        <strong data-bind="text: name"></strong>
        <button class="del">Delete</button>
    </li>
</ul>
function appViewModel() {
    this.products = ko.observableArray([
        { name: "XBox" },
        { name: "PlayStation" },
        { name: "Banana" },
        { name: "Wii" }
    ]);
    
    this.removeProduct = function(product) {
        this.products.remove(product);   
    }
};

var viewModel = new appViewModel();
ko.applyBindings(viewModel);

// Use jQuery to catch the events
$(".prods").on("click", ".del", function() {
    viewModel.removeProduct(ko.dataFor(this));
});