JQuery кнопка мобильного Append не отображается правильно

Question

Когда я динамически добавлять литий, который содержит кнопку, кнопка правильно делает, когда я добавляю это так:

$($ul).append($li).trigger('create'); 
$($ul).listview("refresh"); 
$($ul).trigger("updatelayout"); 

Но мне нужно добавить литиево с помощью кнопки после первый пункт в ul. Это добавляет li в правильное положение, но кнопка не отображается правильно.

$($ul).eq(0).after($($li)).trigger('create'); 
$($ul).listview("refresh"); 
$($ul).trigger("updatelayout"); 

Я полностью запятнал и буду благодарен за любые предложения !!!

Уточнить мой вопрос (надеюсь, это поможет): Почему кнопка визуализируется правильно, когда я просто добавляю li и не правильно, когда я пытаюсь добавить li в определенную позицию в ul?

Вот HTML кнопки после того, как она будет вставлена:

<button class="deleteLiRadio" data-inline="true" data-mini="true" data-shadow="false" data-iconpos="notext" data-icon="delete">Button</button> 

Answer 1

Я считаю, что ваша проблема в том, что вы на самом деле добавление li за пределами ul.

Вместо $($ul).eq(0) должно быть $ul.find('li')

Например, следующий код должен делать то, что вы хотите

var $ul = $('#myList'); 
    var $li = $('<li><button class="deleteLiRadio" data-role="button" data-inline="true" data-mini="true" data-shadow="false" data-iconpos="notext" data-icon="delete">Button</button></li>'); 
    $ul.find('li').eq(0).after($li); 
    $ul.trigger('create').listview("refresh"); 
    $ul.trigger("updatelayout"); 

http://jsfiddle.net/rbAc9/1/