Attach event to ckeditor element in jquery way

Although Ckeditor provides it’s own api to add events to it’s dom elemnts,but one may add events to ckeditor elements in jquery way.

I have used CKEDITOR 4.0 for my own purpose as I needed to implement it’s Inline Editing feature.

Events can be attached to ckeditor contents with the help of contentDom() event provided by ckeditor and it fired when content of the editor (its DOM structure) is ready.

Following example will attach click event to ckeditor dom elements.

     editor.on( 'contentDom', function(){
			var my_elements = $( editor.window.getFrame().$ ).contents().find( '.my_images_class' ); // find by class

			my_elements.each(function(i){
				$(this).off('click').on('click',function(e){ 
				 // action here 
				});
		});

In the above code we have used off before on,because of contentDom.
Thus any previously attached event will be discarded

contentDom:

This event is very handy if you want any action immediatly when ckeditor DOM gets loaded.
This means contentDom will fire when you switch between “view source” of ckeditor DOM

$(function(){
   editor1.on( 'contentDom', function() {
          alert('ckeditor content loaded');
   });

});

for more information http://docs.ckeditor.com/#!/api/CKEDITOR.editor-event-contentDom