Are you using jQuery Mobile and trying to manipulate a listview?
I was trying to do this earlier, adding new <li> elements to a <ul data-role="listview">. However, none of the new elements were looking correct, or having the right styles applied.
The solution is to tell jQuery Mobile to refresh the list and apply the styles.
If your <ul> list has an id of wibble you could use the following…
$('#wibble').listview('refresh');
Your list will now have the correct styling applied.
I needed to replace the header text in a jQuery Mobile application with an image.
I first tried wrapping the image in the <h1> tag, but that adds quite a large margin and cuts off some of my image.
The solution I used was to instead add a wrapper div that centers everything in it. My header ended up looking like this…
center-wrapper is a custom style defined like this…
.center-wrapper {
text-align: center;
}
.center-wrapper * {
margin: 0 auto;
}
There may be a better way to do this, but this works for now.