Как реализовать иерархический многоуровневый datatable в javaScript?

Я внедряю многоуровневое datatable без использования каких-либо плагинов или библиотеки. Я хочу реализовать на основе javaScript, JQuery или угловых js. Я проверил один из ниже ссылок,

Пройдите все узлы дерева объектов JSON с помощью JavaScript

вложенная таблица с использованием ng-repeat

• Форма Отправить jQuery не работает
• Получить внешний HTML-код выбранного элемента
• Установите опцию выбора «selected», по значению
• Не удалось загрузить Google в iframe в fancybox
• проверка нескольких текстовых полей с одинаковым именем с помощью jquery validator проверяет только первый ввод

Но моя json-структура отличается от предыдущей ссылки.

Мне нужно отобразить мой JSON в интерфейсе структуры дерева. Я не уверен в уровне кода в html. Все уровни должны обрабатываться javascript.

Я реализовал jsfiddle: http://jsfiddle.net/varunPes/0n9fmawb/40/

СТРУКТУРА JSON

[ { Home:{ "checkbox_view":true, "checkbox_edit":false, "checkbox_delete":true } }, { "watchColorWorld":{ "local":{ "app-local-black":{ "checkbox_view":true, "checkbox_edit":true, "checkbox_delete":true } }, "global":{ "app-global-red":{ "checkbox_view":true, "checkbox_edit":true, "checkbox_delete":true } }, "world":{ "app-world-green":{ "checkbox_view":true, "checkbox_edit":true, "checkbox_delete":true } } } }, { "systemMgmt":{ "checkbox_view":true, "checkbox_edit":true, "checkbox_delete":true } }, { "rules":{ "Rule1":{ "rule2":{ "rule3":{ "checkbox_view":true, "checkbox_edit":true, "checkbox_delete":true } } } } } ] 

Выпущенный результат

Вы отвечаете ценным для меня. Заранее спасибо.