Dynamicly adding Form Elements

Dynamicly adding Form Elements

Hello,

I know, that there are some other posts about similar problems, but none of the solutions work for me. I use jquery mobile 1.0a3.

I have a form with some Elements, which are grouped in Lists. After special lists (class="multiRow"), i want to insert a button dynamicly. This button should dublicate the first <li> of the list (and the form-elements inside the li). Here is the code:

  1. <div>
                        <label for="awards">Multiforms</label>
                        <ul id="awards" class="multiRow">
                            <li data-role="fieldcontain">   
                                <label>Bezeichnung</label><input type="text" class="name" value="{{name}}" />
                                <label>Beschreibung</label><textarea rows="3" cols="40" class="awardDescription">{{awardDescription}}</textarea>                            <label>Typ</label>
                                <select class="type">                                  
                                    <option value="Weinbau">Weinbau</option>
                                    <option value="Weinbeschreibung">Weinbeschreibung</option>               
                                </select>
                            </li>
                        </ul>
                    </div>











  1.     $(document).ready(function() {
            $(".multiRow").each(function(){
                $('<a data-icon="add" href="#" data-role="button" class="addButton" rel="' + $(this).attr('id') + '">Add</a>').insertAfter(this);
            });
            $(".addButton").click(function() {
                var list = $("#" +$(this).attr("rel"));
                var cElement = list.children().first().clone();
                $(':input',cElement).val('').removeAttr('checked').removeAttr('selected'); //Um die Auswahl/Text zu entfernen
                cElement.appendTo(list);
                 //$(list).page();
                 $('select').selectmenu('refresh');
                //$("select").selectmenu('refresh'); //Um die Select-Box zu refreshen
                return false; //Eigentlich, damit das Formular nicht abgeschickt wird, aber er kommt gar nicht so weit, weil er vorher schon zu submitten anfängt
            });
    });













There are 2 different problems:

1) The Add-Button is show, but as a link, not as a button. How can I force jquery, to rerender this button (it has the data-role="button" attribute)?

2) The new select-box doesn't work. The  $('select').selectmenu('refresh'); function doesn't work! Any ideas?

Thanks!