Accordion menu

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>
<body>
    <div id="cont"></div>
    <script>
        var controls = (function () {
            function hidePrev(item) {
                var prev = item.previousElementSibling;

                while (prev) {
                    var subList = prev.querySelector('ul');
                    if (subList) {
                        subList.style.display = "none";
                    }
                    prev = prev.previousElementSibling;
                }
            }

            function hideNext(item) {
                var next = item.nextElementSibling;

                while (next) {
                    var subList = next.querySelector('ul');
                    if (subList) {
                        subList.style.display = "none";
                    }
                    next = next.nextElementSibling;
                }
            }
            function Accordeon(selector) {
                var items = [];
                var accItem = document.querySelector(selector);

                accItem.addEventListener('click', function (ev) {

                    ev.stopPropagation();
                    ev.preventDefault();

                    var clickedItem = ev.target;
                    if (!(clickedItem instanceof HTMLAnchorElement)) {
                        return;
                    }

                    hidePrev(clickedItem.parentNode);
                    hideNext(clickedItem.parentNode);

                    var sublist = clickedItem.nextElementSibling;

                    if (!sublist) {
                        return;
                    }
                    if (sublist.style.display === "none") {
                        sublist.style.display = "block";
                    } else {
                        sublist.style.display = "none";
                    }
                }, false)
                this.add = function (title) {
                    var newItem = new Item(title);
                    items.push(newItem);
                    return newItem;
                };

                var itemsList = document.createElement('ul');

                this.render = function () {

                    while (accItem.firstChild) {
                        accItem.removeChild(accItem.firstChild);
                    }

                    while (itemsList.firstChild) {
                        itemsList.removeChild(itemsList.firstChild);
                    }

                    for (var i = 0; i < items.length; i+=1) {
                        var domItem = items[i].render();
                        itemsList.appendChild(domItem);
                    }
                    console.log(itemsList);
                    accItem.appendChild(itemsList);
                }

                this.serialize = function () {
                    var serializedItems = [];
                    for (var i = 0; i < items.length; i+=1 ) {
                        serializedItems.push(items[i].serialize());
                    }
                    return serializedItems;
                }
            }

            function Item(title) {
                var items = [];

                this.add = function (title) {
                    var newItem = new Item(title);
                    items.push(newItem);
                    return newItem;
                }
                this.render = function () {
                    var itemNode = document.createElement("li");

                    itemNode.innerHTML = "<a href='#'>" + title + "</a>";
                    if (items.length > 0) {
                        var sublist = document.createElement('ul');
                        sublist.style.display = "none";
                        for (var i = 0; i < items.length; i += 1) {
                            var subItem = items[i].render();
                            sublist.appendChild(subItem);
                        }
                        itemNode.appendChild(sublist);
                    }
                    return itemNode;
                }
                this.serialize = function () {
                    var thisItem = {
                        title: title
                    };
                    if (items.length > 0) {
                        var serializedItems = [];
                        for (var i = 0; i < items.length; i+=1) {
                            var serItem = items[i].serialize();
                            serializedItems.push(serItem);
                        }
                        thisItem.items = serializedItems;
                    }
                    return thisItem;
                }
            }

            function addItem(item, dataItem) {
                var accItem = item.add(dataItem.title);
                if (dataItem.items) {
                    for (var i = 0; i < dataItem.items.length; i++) {
                        addItem(accItem, dataItem.items[i]);
                    }
                }
            }

            return {
                getAccordion: function (selector) {
                    return new Accordeon(selector);
                },
                buildAccordion: function (selector, data) {
                    var accordion = this.getAccordion(selector);

                    if (data) {
                        for (var i = 0; i < data.length; i++) {
                            addItem(accordion, data[i]);
                        }
                    }

                    return accordion;
                }
            }


        }());

        //extensions
        (function () {
            if (!Storage.prototype.setObject) {
                Storage.prototype.setObject = function (key, obj) {
                    this.setItem(key, JSON.stringify(obj));
                }
            }

            if (!Storage.prototype.getObject) {
                Storage.prototype.getObject = function (key) {
                    return JSON.parse(this.getItem(key));
                }
            }
        }());

        var accordion = controls.getAccordion("#cont");
        var webItem = accordion.add("Web");
        var html = webItem.add("HTML");
        html.add("4.1");
        html.add("5");
        webItem.add("CSS");
        webItem.add("JavaScript");
        webItem.add("jQuery");
        webItem.add("ASP.NET MVC");
        var desctop = accordion.add("Desktop");
        desctop.add("Desktop viewer");
        accordion.add("Mobile");
        accordion.add("Embedded");
        accordion.render();

        var serialized = accordion.serialize();
        localStorage.setObject("acc", serialized);
        var deserializedData = localStorage.getObject("acc");
        var clonedAccordion = controls.buildAccordion("#cont", deserializedData);
        console.log(controls.buildAccordion("#cont", deserializedData));
        clonedAccordion.render();
    </script>
</body>
</html>