Adding class to iFrame parent container in Expresso isn't working

Question

I have the Expresso field-type plugin and I'm using the Embed Media button to add iFrames to the page. I've been trying to add a class to the parent div container however I just can't seem to get it to work.

Expresso uses CKEditor and this is what I've tried so far:

(function() {
    CKEDITOR.plugins.add("mediaembed", {
        init: function(a) {
            CKEDITOR.dialog.add("MediaEmbedDialog", function(a) {
                return {
                    title: "Embed Media",
                    minWidth: 550,
                    minHeight: 200,
                    contents: [{
                        id: "iframe",
                        expand: !0,
                        elements: [{
                            id: "embedArea",
                            type: "textarea",
                            label: "Paste Embed Code Here",
                            autofocus: "autofocus",
                            setup: function() {},
                            commit: function() {}
                        }]
                    }],
                    onOk: function() {
                        var b = a.document.createElement("div");
                        b.setHtml(this.getContentElement("iframe", "embedArea").getValue());
                        b.className = "video-container"; //My addition
                        a.insertElement(b)
                    }
                }
            });
            a.addCommand("MediaEmbed",
                new CKEDITOR.dialogCommand("MediaEmbedDialog", {
                    allowedContent: "iframe[*]"
                }));
            a.ui.addButton("MediaEmbed", {
                label: "Embed Media",
                command: "MediaEmbed",
                toolbar: "mediaembed"
            })
        }
    })
})();

Towards the bottom of the function you will see the onOK function where I have added:

b.className = "video-container";

However when I add the iFrame code the parent div has no class. I have tried swapping the var b = a.document.createElement("div"); to a span and this worked fine (still no class though) so I know it's the correct piece of code.

If anyone has any ideas as to why this isn't working it would make my Friday that ever-bit more awesome.

Thank you.

Answer 1

Just in case anyone stumbles across this. For the onOk function add the following line of code:

b.setAttribute("class", "video-container");

Add this after the var declaration and before the insertElement function.

This should work for any of the CKEditor plugin functions but double check the variable name first.