I'm trying to add a div dynamically using jQuery mobile, but after adding it, the CSS is not applied even with the refresh.

The is the example.

Code :

$(function() {
     $("#data").append('<div data-role="collapsible"><h3>Div2</h3><p>Content Div2...</p></div>');
     $("#data").listview("refresh");
});

I'm trying to add a div dynamically using jQuery mobile, but after adding it, the CSS is not applied even with the refresh.

The is the example.

Code :

$(function() {
     $("#data").append('<div data-role="collapsible"><h3>Div2</h3><p>Content Div2...</p></div>');
     $("#data").listview("refresh");
});

• javascript
• jquery
• html
• css
• jquery-mobile

2 Answers 2

Use collapsibleset() instead of listview("refresh"):

$("#data").collapsibleset();

See DEMO.

I"m use such method

try{
    $("#data").listview("refresh");
}catch{
    $("#data").listview();
}finally{
    $('[data-role=collapsible]').collapsible();
}

This problem occurs when an item is added to the dynamic