Change select options when i click on a anchor tag

[Tihypdxhd]

What I'm trying to do is replace/change the text inside the \[code\]select\[/code\] tag when I click on the anchor tag. As you will see it only changes it once. What am I doing wrong?HTML\[code\]<div id="navigation"> <ul> <li><a id="slideOne" href="http://stackoverflow.com/questions/12822760/#blue">Blue Product</a></li> <li><a id="slideTwo" href="http://stackoverflow.com/questions/12822760/#red">Red Product</a></li> </ul></div><select> <option disabled="disabled" selected="selected">Select Color</option> <option value="http://stackoverflow.com/questions/12822760/blue">Blue</option> <option value="http://stackoverflow.com/questions/12822760/red">Red</option></select>?\[/code\]JS\[code\]$('#navigation a').click(function() { $('select').val(this.id).change();});?\[/code\]Here is my jsFiddle.