jQuery Mobile的滑塊不滑動後動態HTML添加到DIV

我希望得到一個JSON回來的標題，在頁面加載多個jQuery Mobile的滑塊的值。我可以動態生成滑塊HTMLS追加到div在頁面上，並指定正確的值，但滑塊不會滑動。我錯過了什麼？jQuery Mobile的滑塊不滑動後動態HTML添加到DIV

HTML：

<div id="mySlider"> 
    </div> 
    <div id="mySliderHTML" style="display: none;"> 
     <span>#{CompName} 
      <input id='#{id}' name='#{id}' type="range" pattern="[0-9]*" min="0" max="10" data-highlight="true" 
       value="#{value}" data-show-value="true" data-popup-enabled="true" /> 
     </span> 
     <br /> 
</div>

的Javascript：

$(document).ready(function() { 
     $.getJSON('CompHandler.ashx', function (data) { 
      if (data.length > 0) { 
       var mySlider = $('#mySlider'); 
       $.each(data, function (index, json) { 
        var mySliderHTML = $('#mySliderHTML').html(), 
        cID = json.cid, 
        name = json.name, 
        compValue = json.value, 
        percent = compValue + "0%"; 
        htmlToAppend = mySliderHTML.replace(/#\{id\}/g, cID).replace(/#\{CompName\}/g, name).replace(/#\{value\}/g, compValue).replace("width: 0%", "width: " + percent).replace("left: 0%", "left: " + percent); 
        $('#' + cID).val = compValue; // This didn't do anything. 
        mySlider.append(htmlToAppend); 
       }); 

      } 
     }); 
    });

來源

2013-11-21 imObjCSwifting