How to create the gridview dynamically using jquery?

How to create the gridview dynamically using jquery?

I'm trying to get the titles in my xml file side by side dynamically. I tried but i didn't get the title side by side.

My code:

  1. $(xml).find('item').each(function () {
  2. var item = $(this).attr("name");
  3. $("#grid_list").append('<div class="ui-block-a">
  4.             <div class="ui-bar ui-bar-c" style="margin: 5px;">
  5.             <a href="#">"' + item + '"</a></div></div>
  6.             <div class="ui-block-b"><div class="ui-bar ui-bar-c" style="margin: 5px;">
  7.             <a href="#"></a></div></div>'); $("#grid_list").grid('refresh'); });




Desired output: It has to display the items as side by side like "item1" in 1st row 1st column and "item2" in 1st row 2nd column and so on.And the block should be in square shape in the middle of the screen.

Thanks in Advance.