JQuery Mobile Button Creation

Question

jQuery mobile, despite being striking in different ways, is sometimes unpleasant. In this case, I am trying to dynamically create one of the very nice buttons that are in the library. Basically what I want to do is enter text in the input field and when I press the spacebar it creates a jQuery mobile button with text.

My js work fine when I use only jquery to create buttons, etc., but when I use jqm, but it initializes the class = ui-btn-hidden for some reason.

Anyone with jqm experience please help

Answer 1

Here is an example:

• http://jsfiddle.net/WEyyh/3/

Js

$('#createButton').bind('click', function() { $('#buttonPlaceHolder').append('<a href="#" data-role="button">'+$('#buttonText').val()+'</a>'); // refresh jQM controls $('#home').trigger('create'); }); 

HTML

 <div data-role="page" id="home"> <div data-role="content"> <input type="text" id="buttonText" placeholder="Enter Button Name"/> <input type="button" id="createButton" value="Create Button" /> <div id="buttonPlaceHolder">&nbsp;</div> </div> </div>