JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://dl.dropboxusercontent.com/u/12182625/ractive.js"></script>
<div id='template'></div>
<script id='temp' type='text/ractive'>
{{# opt[1]}}
{{# { group: name, options: options } }}
{{# options:i }}
<label><input type='radio' name='{{~/selectedOpt[group]}}' value='{{this}}'> {{name}}</label>
{{/}}
{{/}}
{{/}}
<p>{{ JSON.stringify(selectedOpt)}}</p>
</script>
JavaScript
var a = {name:"foo21",value:{id:"bar22",color:"red"}};
var ractive = new Ractive({
el: 'template',
template: '#temp',
data: {
selectedOpt: {group2:a},
opt: [
{name: 'group1', options: [
{name: 'foo11', value: {id: 'bar12', color: 'red'}},
{name: 'foo12', value: {id: 'bar12', color: 'blue'}}
]},
{name: 'group2', options: [
a,
{name: 'foo22', value: {id: 'bar22', color: 'blue'}}
]},
]
}
});