jQuery Mobileのアイコンを動的に変更する

Question

アイコンを動的に変更すると、マークアップ内の変更が反映されていても、ページ上の変更は反映されません。

例：

 <ul data-role="listview" data-autodividers="true" data-filter="true" data-inset="true"> 
     <li data-icon="check"><a href="#">Adam Kinkaid</a></li> 
     <li data-icon="check"><a href="#">Alex Wickerham</a></li> 
     <li data-icon="check"><a href="#">Avery Johnson</a></li> 
     <li data-icon="check"><a href="#">Bob Cabot</a></li> 
     <li data-icon="check"><a href="#">Caleb Booth</a></li> 
     <li data-icon="check"><a href="#">Christopher Adams</a></li> 
     <li data-icon="check"><a href="#">Culver James</a></li> 
    </ul> 

$("li").tap(function() { 
    //Alert the old icon 
    alert($(this).jqmData("icon")); 

    //Toggle 
    $(this).jqmData("icon") == "false" ? $(this).jqmData("icon", "check") :    $(this).jqmData("icon", "false"); 

    //Alert the new icon 
    alert($(this).jqmData("icon")); 
}); 

http://jsfiddle.net/Mc97V/

Answer 1

私はあなたの作業例作ら：http://jsfiddle.net/Gajotres/qgE6L/

$('#index').live('pagebeforeshow',function(e,data){  
    $("li").tap(function() { 
     $(this).buttonMarkup({ icon: "edit" }); 
    }); 
});