I am building an extension that has a pop up whose elements are constructed by a function call everytime the mouse hovers over the popup option. I am able to achieve this. Now I need to have a popup for each of the menu item (inside the original popup) which is not dynamic though. I have this code, but it does not work:

for (var m=0; m < localpubliclist.length; m++)
{

var newItem = document.createElement("menu");
newItem.setAttribute("label", publicdisplayname[m]);
newItem.setAttribute("id", "public" + m);
myMenuPopup.appendChild(newItem);

var newpopup = document.createElement("menupopup");
newpopup.setAttribute("id","publicpop" + m);
newItem.appendChild(newpopup);

var new1= document.createElement("menuitem");
new1.setAttribute("label", "Home");
new1.setAttribute("id", "publichome" + m);
newpopup.appendChild(new1);
}

doing this forms the first popup where i can see all my menu with names publicdisplayname[m]. each of these is to be a popup which displays "Home". This does not work. the second popup (popup on publicdisplayname[m]) does not open.

i have been stuck on this for quite some time and have tried various things cut it doesnt work. Can we do this at all? can we have double dynamic popups?