JQuery Mobile multiple level (3 or 4 levels) Nested Listview with JSON Data

Can anyone provide me a simple demo of jQuery Mobile, 3 to 4 levels of dynamic nested listview/treeview that takes in list details from nested JSON data present in the same HTML file?

Just 1 or 2 ul/li will do, I will try my best to figure the remaining myself!

I am new to both JSON and jQuery. I have spent plenty of time going through several examples in order to get this done.

These are a few links that I have tried to follow but failed as I do not know how to convert another version of jQuery to jQuery Mobile:

1. http://ift.tt/1roSBoF
2. http://ift.tt/1BBKIHG

Below is my current JSON structure that I manage to produce:

var info = {
[{
    "id":1,
    "name":"Folder A",
    "img":"img/1.png",
    "branch":[{
        "id":2,
        "name":"Folder A.1",
        "my-hash":"hash-2",
        "my-url":"sample.html?request=page-2"
    },
    {
        "id":3,
        "name":"Folder A.2",
        "my-hash":"hash-3",
        "my-url":"sample.html?request=page-3"
    },
    {
        "id":4,
        "name":"file a.1",
        "my-hash":"hash-4",
        "my-url":"sample.html?request=page-4"
    },
    {
        "id":5,
        "name":"file a.2",
        "my-hash":"hash-5",
        "my-url":"sample.html?request=page-5"
    }],
    "my-hash":"hash-1",
    "my-url":"sample.html?request=page-1"
},
{
    "id":6,
    "name":"Folder B",
    "img":"img/6.png",
    "my-hash":"hash-6",
    "my-url":"sample.html?request=page-6"
},
{
    "id":7,
    "name":"Folder C",
    "img":"img/7.png",
    "branch":[{
        "id":8,
        "name":"Folder C.1",
        "branch":[{
            "id":9,
            "name":"Folder C.1.1",
            "my-hash":"hash-9",
            "my-url":"sample.php?request=page-9"
        },
        {
            "id":10,
            "name":"Folder C.1.2",
            "my-hash":"hash-10",
            "my-url":"sample.html?request=page-10"
        },
        {
            "id":11,
            "name":"file c.1.1",
            "my-hash":"hash-11",
            "my-url":"sample.html?request=page-11"
        }],
        "my-hash":"hash-8",
        "my-url":"sample.html?request=page-8"
    },
    {
        "id":12,
        "name":"file c.1",
        "img":"img/12.png",
        "my-hash":"hash-12",
        "my-url":"sample.html?request=page-12"
    }],
    "my-hash":"hash-7",
    "my-url":"sample.html?request=page-7"
},
{
    "id":13,
    "name":"file a",
    "img":"img/13.png",
    "my-hash":"hash-13",
    "my-url":"sample.html?request=page-13"
},
{
    "id":14,
    "name":"file b",
    "img":"img/14.png",
    "my-hash":"hash-14",
    "my-url":"sample.html?request=page-14"
},
{
    "id":15,
    "name":"file c",
    "img":"img/15.png",
    "my-hash":"hash-15",
    "my-url":"sample.html?request=page-15"
}]

Ok, the question is, provided that my JSON data is correctly structured, can anyone help me in writing a jQuery Mobile script that dynamically takes in data and produce list result as shown in this JQM demo

http://ift.tt/1dz6iRF

I will explain more if this is unclear. Will really appreciate any help. Thanks!