[JavaScript][wysihtml]iタグに独自classを付与する

wysihtmlプラグインを実行して斜体のiタグに独自のclassを付与したい局面が発生したので調査しました。

stackoverflowのwysihtml5 editor - how to simply add a class to an element?でも同じ悩みを抱えている人がいて、実際に下のように組んでgruntかけたら動いた。

(function(wysihtml5){
  wysihtml5.commands.italic = {
    exec: function(composer, command, className) {
      wysihtml5.commands.formatInline.execWithToggle(composer, command, "i", className, new RegExp(className, "g"));
    },

    state: function(composer, command, className) {
      // element.ownerDocument.queryCommandState("italic") results:
      // firefox: only <i>
      // chrome:  <i>, <em>, <blockquote>, ...
      // ie:      <i>, <em>
      // opera:   only <i>
      return wysihtml5.commands.formatInline.state(composer, command, "i", className, new RegExp(className, "g"));
    }
  };
}(wysihtml5));

実行は下。

<div id="wysihtml5-toolbar" style="display: none;">
  <a data-wysihtml5-command="italic" data-wysihtml5-command-value="hoge">斜体</a>
</div>

iタグ以外にも使えるので重宝します。