Provide hints to user while searching - arrays

Question

I am stuck on the functionality to show user hints while searching of products in application.I do have an Api which returns me all category-Listing with its sub-categories/child.I have save it in my local storage but i am really confused that how can i make loop to display characters in hint list just below the search bar while user is typing something in search bar.I know the process but do not know how to implement in all nested child for every category.
I have found this below mentioned example but again its working for only simple Array ..
Example :- http://codepen.io/calendee/pen/pCwyx
Can any one suggest me that how can i use the above logic for my array
[
{
id: "165",
title: "Women's Fashion",
url: "womens-fashion",
children: [
{
id: "176",
title: "Women's Aparel",
url: "women-s-aparel",
children: [
{
id: "221",
title: "Formal",
url: "formal"
},
{
id: "222",
title: "Casual",
url: "casual"
},
{
id: "223",
title: "Traditional",
url: "traditional"
},
{
id: "224",
title: "Nightwears",
url: "nightwears"
},
{
id: "225",
title: "Winter wears",
url: "winter-wears"
},
{
id: "240",
title: "Party Wear",
url: "party-wear"
}
]
},
{
id: "220",
title: "Western Wear",
url: "western-wear",
children: [
{
id: "318",
title: "Glam & Luxe Style Wears",
url: "glam-luxe-style-wears"
},
{
id: "412",
title: "Dresses",
url: "dresses"
},
{
id: "413",
title: "Tops & Tees",
url: "tops-tees"
},
{
id: "414",
title: "Bottom Wear",
url: "bottom-wear"
}
]
},
{
id: "305",
title: "Ethnic Wear",
url: "ethnic-wear",
children: [
{
id: "407",
title: "Sarees",
url: "sarees"
},
{
id: "408",
title: "Lehnga Choli",
url: "lehnga-choli"
},
{
id: "409",
title: "Gown",
url: "gown"
},
{
id: "410",
title: "Salwar Kameez & Churidar",
url: "salwar-kameez-churidar"
},
{
id: "411",
title: "Kurtis",
url: "kurtis"
}
]
},
{
id: "306",
title: "Jewellery",
url: "jewellery",
children: [
{
id: "307",
title: "Anklets",
url: "anklets"
},
{
id: "308",
title: "Bridal Set",
url: "bridal-set"
},
{
id: "309",
title: "Mala",
url: "mala"
},
{
id: "310",
title: "Mangalsutra",
url: "mangalsutra"
},
{
id: "311",
title: "Necklace Set",
url: "necklace-set"
},
{
id: "312",
title: "Ring",
url: "ring"
},
{
id: "316",
title: "Bangles",
url: "bangles"
},
{
id: "317",
title: "Earings",
url: "earings"
}
]
},
{
id: "415",
title: "Leggings & Jeggings",
url: "leggings-and-jeggings"
},
{
id: "416",
title: "Lingeries & Nightwears",
url: "lingeries-and-nightwears"
},
{
id: "417",
title: "All Women Clothing",
url: "all-women-clothing"
}
]
},
{
id: "404",
title: "Men's Fashion",
url: "mens-fashion",
children: [
{
id: "177",
title: "Men's Aparel",
url: "men-s-aparel",
children: [
{
id: "226",
title: "Casual",
url: "casual"
},
{
id: "227",
title: "Formal",
url: "formal"
},
{
id: "230",
title: "Others",
url: "others"
},
{
id: "303",
title: "Winter",
url: "winter"
},
{
id: "239",
title: "Party Wear",
url: "party-wear"
}
]
},
{
id: "229",
title: "Ethnic",
url: "ethnic",
children: [
{
id: "418",
title: "Indo Western",
url: "indo-western"
},
{
id: "419",
title: "Kurta Pyjama",
url: "kurta-pyjama"
},
{
id: "420",
title: "Kurta",
url: "kurta"
},
{
id: "421",
title: "Sherwanis",
url: "sherwanis"
}
]
},
{
id: "228",
title: "Western",
url: "western",
children: [
{
id: "422",
title: "Jeans",
url: "jeans"
},
{
id: "423",
title: "Polo & Tees",
url: "polo-tees"
},
{
id: "424",
title: "Shirts",
url: "shirts"
},
{
id: "425",
title: "Trousers",
url: "trousers"
},
{
id: "426",
title: "Shorts & 3/4",
url: "shorts-and-3-4"
}
]
},
{
id: "427",
title: "Inner wear",
url: "inner-wear"
},
{
id: "428",
title: "Sleep & Lounge Wear",
url: "sleep-and-lounge-wear"
},
{
id: "429",
title: "Knit Wear",
url: "knit-wear"
},
{
id: "430",
title: "Suits & Blazers",
url: "suits-and-blazers"
},
{
id: "431",
title: "Sweat Shirts",
url: "sweat-shirts"
}
]
}
]