JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-debug.js"></script>
<ul data-bind="foreach: {data: MyMessages, as: 'foo'} "  class="list-unstyled">
    <li>
        <div>
            <a href="#" class="close" data-dismiss="alert">&times;</a>
            <em><label data-bind='text: foo.MessageType1'></label></em>
            <label data-bind='text: foo.MessageToShow1'></label>
        </div>
    </li>
</ul>

JavaScript

var vm = {
    MyMessages: [{
        MessageType1: 'A',
        MessageToShow1: 'B '
    }]
};

ko.applyBindings(vm);