jquery mobile button refresh and multiple binding - jquery-mobile

Question

I've a problem with Jquery Mobile. Buttons that I add from JS are not displayed properly, and lacks CSS. On the other hand, hitting a button calls that function, but if another button is clicked, because of on off tap, problem occurs. "addExerciseButton" lacks CSS, and the problem occurs within addExerciseButton
<div data-role="page" id="addprogram">
<div data-role="header" data-position="fixed">
<h1>Add Program</h1>
Back
Save
</div><!-- /header -->
<div data-role="content" class='addprogramcontent'>
<div data-role="fieldcontain" class='addprogramlist'>
</div>
</div>
</div><!-- /page -->
JS:
$(document).off("tap").on('tap', '.addExerciseButton', function(event){
//alert(1);
var container = $(this).attr('id');
alert(container);
});
JS page:
eArray.sort();
var container = $("#addprogram").find(".addprogramlist");
container.empty();
// alert(eArray);
for(var i = 1; i <=7; i++)
{
var day = getDay(i);
container.append("<label for='day-" + i + "' class='select'>" + day + "</label>");
var select = $("<select name='day-" + i + "' id='day-" + i + "'></select>");
for (var j = 0; j < eArray.length; j++)
{
select.append("<option value='" + eArray[j] + "'>" + eArray[j] + "</option>");
}
container.append(select);
var addExerciseButton = "<input type='button' value='Add Exercise' class='addExerciseButton' data-role='button' data-theme='b' id='day-" + i + "'/>"
container.append(addExerciseButton);
}
$("select").selectmenu();
$("#day-1").change(function() {
// alert(value);
$("#day-1 option:selected").each(function () {
// alert(1);
var value = $(this).val();
$(this).parent().selectmenu('disable');
alert(value);
});
});
});

Answer 1

you have to refresh buttons after you append em to the dom:
working example: http://jsfiddle.net/PG2bV/55/
CODE
$(":button").button();

Answer 2

Using
container.trigger('create');
solved my problem with no CSS on buttons.