如何從下拉菜單中獲取所選項目？

Question

我想用所選項目列表替換跨度的默認值。

<span id="selected-lang">Select your language</span> 
<ol class="lang-list"> 
    <li data-value="en" class="active"> 
     <a><img src="en.gif" />English</a> 
    </li> 
    <li data-value="de"> 
     <a><img src="de.gif" />Deutsch</a> 
    </li> 
    <li data-value="fr"> 
     <a><img src="en.gif" />Francais</a> 
    </li> 
</ol> 

我試圖用jQuery .change但doesnt'work：

$(".lang-list").change(function() { 
    var str = ""; 
    $(".lang-list li.active").each(function() { 
     str += $(this).text()+""; 
     }); 
    $("#selected-lang").text(str); 
}) 

我怎樣才能做到這一點？
謝謝！

Answer 1

$(".lang-list a").click(function() { 
    $('ol.lang-list li').removeClass('active'); 
    $(this).parent().addClass('active'); 
    $("#selected-lang").text($(this).text()); 
}) 

jsFiddle example