jquery ui selectmenu, regarding changing selected items

I'm trying to implement a currencty converter which I succeeded but now I'm implementing a button that will change the selected option between two selected menus which means that if in the first menu I have usd selected and in the second menu I have gbp selected then when pressing the button, I want in the first menu to have the gbp selected and in the second menu the usd selected. I have manage to change the selected option on both menus, but it doesn't display it in the menu itself. What have I forgot ?

 $(function(){
    $('a#switchButton').click(function(){
        var $sel1 = $('#fromCurrency');
        var val1 = $sel1.val();
        var $sel2 = $('#toCurrency');
        var val2 = $sel2.val();
        $sel1.find("option[value='"+val1+"']").attr("selected",false);
        $sel1.find("option[value='"+val2+"']").attr("selected",true);
        $sel2.find("option[value='"+val2+"']").attr("selected",false);
        $sel2.find("option[value='"+val1+"']").attr("selected",true);
    });
});

Here is a screen shot, when pressing on the icon in the middle, nothing changes here, but only in the code itself. If I press the icon, I want the usd to appear in "from" and inr in "to".

jsfiddle.net example

Turns out the selectmenu() function has it's own ways of changing values.
Check out a working version here: http://jsfiddle.net/atR6D/55/

$('#switchButton').click(function(){
    var sel1 = $('#fromCurrency').selectmenu("value");
    var sel2 = $('#toCurrency').selectmenu("value");
    $('#fromCurrency').selectmenu("value", sel2);
    $('#toCurrency').selectmenu("value", sel1);
});  

It looks like it's making a representation of the select list in <span> tags which is why you can't actually change the original select list.