Knockoutjs.com - Hello World Example

http://knockoutjs.com/examples/helloWorld.html

HTML

<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-debug.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.js"></script>
<div class='liveExample'>   
    <div id="container"></div>
</div>

JavaScript

// Here's my data model
var baseVM = function() {
    var self = this;
    this.selected = {
        val: ko.observable()
    };
    
    console.log(self.selected.val()); // undefined
    
    setTimeout(function () {
        $('#container').html('<div id="ctn"><span data-bind="text: base.selected.val"></span><select data-bind="options: list, optionsText: \'t\', optionsValue: \'val\', optionsCaption: \'Select classification\', value: base.selected.val, valueAllowUnset: true" ></select></div>');
        ko.applyBindings(new VM(self), document.getElementById('ctn'));
    });
    
    setTimeout(function () {
        console.log(self.selected.val()); // Undefined
        self.selected.val(2);
        console.log(self.selected.val());
    });
};

var VM = function(base) {
    var self = this;
    this.base = base;
    this.list = ko.observableArray();
    
    setTimeout(function () {
        self.list([{val: '2', t: '2'}]);
    }, 100);
};
 
$(function () {
    ko.applyBindings(new baseVM());
});