Странное поведение нокаута

 <script>


$(document).ready(function () {


var ErrorsListModel = function (items) {


var self = this;


self.allErrors = ko.observableArray(items);


self.hasErrors = ko.computed(function () {


return self.allErrors().length > 0;


});


}


$("#btnErr1").click(function (evt)


{


ko.cleanNode($("#ctlAlertUL")[0]);


var rt = '["msg1", "msg2"]';


var ve = $.parseJSON(rt);


ko.applyBindings(new ErrorsListModel(ve), $("#ctlAlertUL")[0]);


});


$("#btnErr2").click(function (evt)


{


ko.cleanNode($("#ctlAlertUL")[0]);


var rt = '[]';


var ve = $.parseJSON(rt);


ko.applyBindings(new ErrorsListModel(ve), $("#ctlAlertUL")[0]);


});


});


</script>

HTML: Script part:

 <div id="ctlAlert" class="alert error-message">


<ul id="ctlAlertUL" data-bind="foreach: allErrors">


<li data-bind="text: $data" class="text-danger"></li>


</ul>


</div>


<button id="btnErr1">Err1</button>


<button id="btnErr2">No ERR</button>

Код (JavaScript): 1. Когда я много раз нажимаю Err1, я вижу, что MSG умножается дважды при каждом щелчке.

2. Когда я нажимаю NoERR, ctlAlertUL очищается, но когда я после этого нажимаю Err1, я не вижу нового сообщения MSG. Это меня расстраивает. Что я делаю не так?