JSFiddle - React, Tailwind, and code Playground

by hejdav

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.2/knockout-debug.js"></script>
<!-- ko foreach: boxes -->
  <div>
    <!-- ko text: $data --><!-- /ko -->:
    <label><input type=radio value=apple data-bind="attr: { name: 'fruit-' + $index() }">apple</label>
    <label><input type=radio value=banana data-bind="attr: { name: 'fruit-' + $index() }">banana</label>
  </div>
<!-- /ko -->

<button data-bind="click: switchBoxes">switch</button>

JavaScript

var viewModel = function () {
	this.boxes = ko.observableArray(['First', 'Second']);
  
  this.switchBoxes = function () {
  	this.boxes.splice(0, 2, this.boxes()[1], this.boxes()[0]);
  };
};

ko.applyBindings(new viewModel());