insertHTML with empty span throws up error - only tested in FF

Hi, I'm very new here and this is my first shot at making a custom Plugin.  The plugin is to duplicate the text color dialog but as a dropdown instead.

I have got the span element to wrap around selected Text within the editor but the main issue is that if the user hasn't selected any text that a span should still be inserted and the cusor appears within that span.

Here is my code below:

CKEDITOR.plugins.add( 'colordropdown',
    {
        requires: ['richcombo'],
        init: function( editor )
        {
            var config = editor.config,
                lang = editor.lang.format;
            // Plugin logic goes here...
            editor.addCommand( 'colordropdownDialog', new CKEDITOR.dialogCommand( 'colordropdownDialog' ) );
            editor.ui.addRichCombo( 'Colordropdown',
                {
                    label: 'Font Color',
                    title: 'Font Color',
                    voiceLabel: 'Font Color',
                    class_name: 'cke_format',
                    multiSelect: 'false',
                    panel :
                    {
                        css : [ config.contentsCss, CKEDITOR.getUrl( CKEDITOR.skin.getPath('editor') + 'editor.css' ) ],
                        voiceLabel : lang.panelVoiceLabel
                    },
                    init: function () {
                        this.startGroup('Font Color');
                        var list=this;
                        // @todo need to make this dynamic!!!
                        // Possible to edit the core plugin for this?
                        this.add('rgb(241,232,0)','<div style="float:right;height:15px; width:15px;background-color:rgb(241,232,0);">&nbsp;</div>','COLOR A');
                        this.add('rgb(0,176,146)','<div style="float:right;height:15px; width:15px;background-color:rgb(0,176,146);">&nbsp;</div>','COLOR B');
                        this.add('rgb(0,161,222)','<div style="float:right;height:15px; width:15px;background-color:rgb(0,161,222);">&nbsp;</div>','COLOR C');
                        //this.add('value', 'drop_text', 'drop_label');
                        //

                    },
                    onClick: function (value) {
                        // onClick of select will get the selected text and wrap a span around it and set
                        // that span to contain the select color

                        editor.focus();

                        var getSelectedText = function(editor) {
                            var selectedText = '';
                            var selection = editor.getSelection();
                            if (selection.getType() == CKEDITOR.SELECTION_TEXT) {
                                if (CKEDITOR.env.ie) {
                                    selection.unlock(true);
                                    selectedText = selection.getNative().createRange().text;
                                } else {
                                    selectedText = selection.getNative();
                                }
                            }
                            return(selectedText);
                        }

                        var selectedContent = getSelectedText(editor);

                        editor.fire('saveSnapshot');
                        // Now wrap the span around the selected text using the values selected as the new color
                        var wrap = "<span style='color:"+value+";'>"+selectedContent+"</span>";

                        editor.insertHtml(wrap);
                        editor.fire('saveSnapshot');

                    }


                } );


        }


    } );

When on the text editor I don't select any text and I pick my color I get this error in FF firebug:

...fset-1);e&&d(e,a[a.length-1]);if(g&&d(g,a[0])){c.setEnd(c.endContainer,c.endOffs...

This appears within line 320 in ckeditor.js and thus stops the span being inserted.

I would really appreciate the help here as it works when I insert " " within the span but that is certainly not ideal.

P.S when I insert the HTML I would also like the cursor to appear within the span but I haven't found the answer to that either - again any help would be much appreciated.