Добавление div в div в phonegap с javascript

Question

Я учусь разрабатывать приложения с телефонной связью. Моя проблема в том, что на момент добавления div он не показывает, как следует.

Вот часть моего кода

<div data-role="content" id="contenido"> 
    <div data-role="collapsible-set" id="tareas"> 

    <div data-role="collapsible" id="tarea_1">'+ 
     '<h3>Tarea 1</h3>'+ 
     '<a class="ui-btn-a ui-btn ui-btn-icon-right ui-icon-carat-r" data-form="ui-btn-up-a" data-swatch="a" data-theme="a" href="#">Descripcion</a>  </div> 

    </div>    
</div> 

это сборно-разборные «tarea_1», если добавить его в HTML будет выглядеть следующим образом.

Но когда я добавляю его с этим кодом:

$('#tareas').append('<div data-role="collapsible" id="tarea_1">'+ 
     '<h3>Tarea 1</h3>'+ 
     '<a class="ui-btn-a ui-btn ui-btn-icon-right ui-icon-carat-r" data-form="ui-btn-up-a" data-swatch="a" data-theme="a" href="#">Descripcion</a>   </div>').listview('refresh'); 

Это то, что я получаю

Я думал, что это из-за обновления, но я cant выяснить, как его решить

Answer 1

Вам нужно использовать «.collapsibleset ('refresh');" вместо ".listview ('обновления')"

Смотрите этот пример for Jquery Mobile

Working Plunkr

$('document').ready(function(){ 
    $('#tareas').append("<div data-role='collapsible' id='tarea1'><h3>Tarea 1</h3></div>").collapsibleset('refresh'); 
});