Creating custom plugin for Ckeditor.

icon.txt

// Location: ckeditor_plugins/qna/icons

This is where you put the plugin icon.

my_module.module

/**
 * Implements hook_ckeditor_plugin().
 */
function my_module_ckeditor_plugin() {
  return array(
    'ckeditor_qna' => array(
      // Name of the plugin used to write it.
      'name' => 'qna',
      // Description of the plugin - it would be displayed in the plugins management section of profile settings.
      'desc' => t('Question and Answer'),
      // The full path to the CKEditor plugins directory, with the trailing slash.
      'path' => drupal_get_path('module', 'my_module') . '/ckeditor_plugins/qna/',
      'buttons' => array(
        'qna' => array(
          'icon' => 'icons/qna.png',
          'label' => 'Insert QnA',
        )
      )
    ),
  );
}

plugin.js

// Location: ckeditor_plugins/qna/

/**
 * @file plugin.js
 * QnA plugin for Ckeditor.
 * Wraps the selected words/text in p element with custom class.
 */
(function() {
  CKEDITOR.plugins.add('qna', {
    icons: 'qna',
    init: function(editor) {
      editor.addCommand('insertQna', {
        exec : function(editor) {
          // Get Text.
          var selected_text = editor.getSelection().getSelectedText();
          // Make a new paragraph.
          var newElement = new CKEDITOR.dom.element('p');
          // Set Attributes.
          newElement.setAttributes({class: 'qna'});
          // Set text to element.
          newElement.setText(selected_text);
          // Add the new element containing selected text.
          editor.insertElement(newElement);
        }
      });
      editor.ui.addButton('qna', {
        label: 'Insert QnA',
        command: 'insertQna',
        icon: this.path + 'icons/qna.png'
      });
    },
    afterInit: function (editor) {
      var dataProcessor = editor.dataProcessor,
        dataFilter = dataProcessor && dataProcessor.dataFilter,
        htmlFilter = dataProcessor && dataProcessor.htmlFilter;
      var writer = editor.dataProcessor.writer;

      // Editor status: 1.
      if (dataFilter) {
        if (typeof editor.config.contentsCss == 'object') {
          editor.config.contentsCss.push(CKEDITOR.getUrl(this.path + 'css/qna.css'));
        }
        else {
          editor.config.contentsCss = [CKEDITOR.config.contentsCss, CKEDITOR.getUrl(this.path + 'css/qna.css')];
        }
      }
    }
  });
})();

qna.css

/* Location: ckeditor_plugins/qna/ */

p.qna {
  color: #333333;
  font-family: Georgia;
  font-size: 16px;
  font-style: italic;
}