I have this mmenu instance where I dynamically add content from ajax just as described on the plugin's page.
Now I not only want to add sublevels dynamically, I want to throw away all levels and add a new first level to the existing mmenu instance.
I've tried calling API.initPanels($("#mm-0")), I've tried removing all classes from DOM elements that were added by mmenu before initializing the mmenu plugin again but it won't render a proper menu. The UL and LIs I add remain untouched.
Got it, here's how:
API.closeAllPanels();
var mmenuActual = API.getInstance();
var $panels = mmenuActual.$pnls.children();
var $updateContainer = $panels.first().find(".mm-listview");
$updateContainer.replaceWith(newContent);
$panels.not(":first").remove();
API.initPanels($panels);
First we need to close all panels to set mmenu back to its' initial state where only the top level is visible.
Next, we need to get hold of all panels and the .mm-listview of the first panel, because that's where mmenu renders the first level from.
Then we update the first level's source with our new content. It doesn't matter if you update the innerHTML of that element or swap it like I did.
The rest of the panels is now obsolete, we throw them all away.
Finally, we tell mmenu to initialize all panels