JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript">solution1 = {"name": "solution1"}</script>
<div id="solution2" data-value='{"name": "solution2"}'></div>
<script id="solution3" type="script" type="text/json">{"name": "solution3"}</script>

<ul id="output" data-bind="foreach: solutions">
    <li data-bind="text: name"></li>
</ul>

JavaScript

var model = {
    solutions: [
        solution5,
        JSON.parse(document.getElementById('solution2').dataset.value),
        JSON.parse(document.getElementById('solution3').innerHTML)
    ]
}

ko.applyBindings(model);