How to show a list with links on header or footer in jquery mobile?

Question

I want to show a footer that contains a list with links, but when i add the links, the "li" becomes a button. How can i fix it?

Some code:

    <div data-role="footer">                    
        <ul data-role="listview">
             <li>
                  <a href="www.google.com"><span>Google</span></a>
             </li>
        </ul>
   </div>

Thanks!

Answer 1

Change your ul to data-role="none" , like this:

   <div data-role="footer">                    
        <ul data-role="none">
             <li>
                  <a href="www.google.com"><span>Google</span></a>
             </li>
        </ul>
   </div>

UPDATE:
You could try the following to get your desired style for the li while making it work like a link:

<ul data-role="listview"> 
   <li style="cursor:pointer" onclick="window.location.href='http://www.google.com/'">Google</li> 
</ul>