jquery mobile navbar

Question

I have no clue why this isnt working. Because I got so many pages and dont want to add the same footer over and over again I made up this which actually works.

        $(document).delegate('[data-role="page"]', 'pagecreate', function() {
          $(this).children('[data-role="footer"]').append('<div data-role="navbar">
     <ul><li class="nav-active"><a href="#home">Home</a></li>
         <li class="nav-active"><a href="#service">Service</a></li>
         <li class="nav-active"><a href="#settings">EInstellungen</a></li>
     </ul></div>');
         });

Unfortunately this doesnt work:

$('.nav-active').live('click', function() {
   $(this).addClass("ui-btn-active ui-state-persist");
});

Sorry I never worked with jFiddle: http://jsfiddle.net/KjubE/N7eqh/

Answer 1

$("yourFooter").trigger('create');

Answer 2

jQuery live is depreciated, you can use the on method instead. Is the rest of your code working? Is the Element in DOM when performing this request?

Please take a look at the api documentation: http://api.jquery.com/trigger/ This has to be executed after attaching with on. For me it works like this. Do you need a fiddle?