CKEditor обновляет контент через onClick

Question

У меня есть набор небольших порций HTML-кода, хранящихся в БД.Я хотел бы перечислить их все (их имена), а затем, после события onClick, вставить фактический HTML-код в текстовую область (область содержимого).

Мне удалось перечислить названия этих небольших таблиц (так как ониимеют общее название) во второй вкладке (в идеале это будут три вкладки, отображающие разные таблицы, поэтому, я думаю, это тоже важно) с этим кодом:

        // Definition of the Second dialog tab (page).
    {
        id: 'tab-tab2',
        label: 'Tables - various html',
        elements: [
            {
                // Another text field for the abbr element id.
                type: 'html',
                html: '<div id=main-container></div>',
                onLoad: function(element) {

                    jQuery.ajax({
                        url: '/tabletemplate/tabletemplates/',
                        success: function (data) {
                            var tables = data.tables;

                                for (var i = 0; i < tables.length; i++) {
                                    $('#main-container').append(
                                        '<div class="html_box" style="border: 1px solid red; margin: 5px;">' +
                                        tables[i][1] +
                                        '</div>'
                                    );
                                }

                        },

                    });

                }
            }
        ]
    }

и теперь я хочу вставитьсодержимое tables[i][2] в текстовой области текущего экземпляра CKEditor.

Я создал функцию, которая в основном делает это:

editor.insertHTML(html);

и вызывается приonClick (onClick = 'editor.my_function(tables[i][2])') но моя консоль продолжает возвращать ошибки, которые не определены.

Есть идеи, как заставить это работать?

---

РЕШЕНИЕ

На основе входных данных:

• Прослушивание событий щелчка в диалоге CKEditor by @ oleq
• Для цикла не пройдетя переменная к функции Jquery внутри цикла от @ MrCode

Я пришел тебяp со следующим кодом, который делает именно то, что я хочу достичь:

                elements: [
                {
                    // Another text field for the abbr element id.
                    type: 'html',
                    id: 'to_id_jest',
                    html: '<div id=main-container></div>',
                    onLoad: function( a ) {

                        var dlg = this;
                        jQuery.ajax({
                            url: '/tabletemplate/tabletemplates/',
                            success: function (data) {

                                var tables = data.tables;

                                //dlg.add('Option 1', '1');
                                    for (var i = 0; i < tables.length; i++) {
                                        (function(i){
                                            $('#main-container').append(
                                                '<div class="html_box" id="my_div_' + i + '">' +
                                                tables[i][1] +
                                                '</div>'
                                            );
                                            CKEDITOR.document.getById( 'my_div_' + i ).on( 'click', function(  ) {
                                                var dialog = this.getDialog();
                                                dialog.hide();
                                                dialog._.editor.insertHtml( tables[i][2] );
                                            }, dlg );
                                        })(i);
                                    }

                            },
                        });
                    }
                }
            ]