Link List items with data role pages

I need some help because the last couple of days I tried but I can't figure it out. I create with a loop different list items. It has this format:

<li><a href="page1"><h3>Page 1</h3><p>Open page 1</p></a></li>

So you can see this page has a href to page1, the other items have links to page2, page3 ect.

How can I create with a loop in the different pages with this code:

<div data-role="page1" id="page1">
    <div data-role="content"><p>This is Page 1</p></div>
</div>

I thought something like this but this isn't working:

jQuery(function($) {          
    var b = $('body');           
    for(i=0; i<10; i++)          
    {                    
        $('<div data-role="page1" id="page1"><div data-role="content"><p>This is Pag开发者_如何学编程e '+i+'</p></div></div>').appendTo(b).page();     
    }    
});

How about

        $('<div data-role="page'+i+'" id="page'+i+'"><div data-role="content"><p>This is Page '+i+'</p></div></div>').appendTo(b);