javascript - How to get the Bootstrap dropdown selected li in span? -

i'm trying selected html in dropdown. i'm using bootstrap dropdown how can this?

i need show selected value in span how can that?

fiddle

html

<ul class="dropdown-menu status_change" role="menu" style="position: relative;">     <li><a href="#">waiting</a></li>     <li><a href="#">approved</a></li>     <li><a href="#">denied</a></li>         <li><a href="#">frozen</a></li>     <li><a href="#">expired</a></li>   </ul> 

jquery

$('.status_change').click(function(){     alert($(this).find('a').html()); }); 

register handler li element

$('.status_change.dropdown-menu li').click(function () {     alert($(this).find('a').html()); }); 

demo: fiddle

in case this refers ul element in handler $(this).find('a') return content of first li always

---

update

change markup to

<span data-toggle="dropdown" aria-expanded="false" class="btn btn-primary btn-xs dropdown-toggle status_change"><span class="status">frozen</span><span class="caret fiveml"></span></span> 

then

$('.status_change.dropdown-menu li').click(function () {     $('.status_change.dropdown-toggle span.status').html($(this).find('a').html()) }); 

demo: fiddle