Update dropdown with select switch using jquery

Question

So, this is a continuation of this post . I need to replace some dropdowns with radio buttons without changing the HTML. In the post I linked earlier, someone came up with a really smart jQuery solution that successfully replaces the dropdown menu with radio buttons and updates the dropdown list when one of the radio buttons is selected.

However, when I implemented it with the plugin, radio buttons will appear, but they do not update the dropdown value when it is selected. I suspect there are some conflicts with js elsewhere on the page, but after some trial and error, I still cannot figure out what is going on. Any ideas? This site can be found here.

Here is the original solution from an earlier post

So here is the updated code:

<script type='text/javascript'> $(function(){ $("#options-1 option").each(function(i, e) { $("<input type='radio' name='r' />") .attr("value", $(this).val()) .attr("checked", i == 0) .click(function () { $("#options-1").val($(this).val()); }) .appendTo("#r"); $("#options-1").change(function(){ $("input[name='r'][value='"+this.value+"']").attr("checked","checked"); }); }); }); </script> 

Answer 1

You need to have this feature in addition to existing code.

 $("#d").change(function(){ $("input[name='r'][value='"+this.value+"']").attr("checked","checked"); });