Skip to content

Instantly share code, notes, and snippets.

@drifterz28
Last active August 29, 2015 14:08
Show Gist options
  • Select an option

  • Save drifterz28/263bd2e797c8609148a4 to your computer and use it in GitHub Desktop.

Select an option

Save drifterz28/263bd2e797c8609148a4 to your computer and use it in GitHub Desktop.
<!DOCTYPE html>
<html>
<head></head>
<body>
<select name="test_name" id="test_options">
<option>test 1</option>
<option>test 2</option>
<option>test 3</option>
</select>
http://media02.hongkiat.com/shopping-cart-designs/10-Hulala-Header-by-Paresh-Khatri.jpg
<script>
(function(){
var select_elm = document.getElementById('test_options');
var elm_name = select_elm.name;
var children_nodes = select_elm.children;
var html = '<div class="radios">';
function removeNode(elm) {
if (elm.parentNode) {
elm.parentNode.removeChild(elm);
}
}
for (var i = 0; i < children_nodes.length; i++) {
html += '<label><input type="radio" name="' + elm_name + '" ';
html += 'value="' + children_nodes[i].textContent + '">';
html += children_nodes[i].textContent + ' some other text';
html += '</label>';
};
html += '</div>';
select_elm.insertAdjacentHTML('afterend', html);
removeNode(select_elm);
}());
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment