How to manipulate Jquery Accordian Header text value

Question

I am having a Jquery Accordian , which creates nested Accordians based on the search result .

This is my jsfiddle

http://jsfiddle.net/DBYLk/25/

Initial

Answer 1

Firstly, you are appending many divs with the same id which is wrong. <div id="sample"> Secondly this is made somewhat harder by your JSON structure. Do you have the ability to modify that at all? This would make things much easier to handle.

However you can store the entire "path" via jQuery's data attribute and replace the basePath with nothing e.g.

var tempName = response[i].replace(selectedeleemnt + "***", "");
html+="<div><a href='#' data-path='" + response[i] + "'>" + tempName + "</a></div><div id ='sample'></div>";

Also the PopCorn in your JSON needs to be uniform as currently you have PopCorn and then Popcorn***

Handling the data thereafter is a matter of manipulating the selectedeleemnt by doing a check if it hasData and then using that instead of the headerText.

Demo:http://jsfiddle.net/robschmuecker/DBYLk/33/