Adding Items To Google Docs' Context-Menu With jQuery

You should probably not do this. You should also probably make backups so you don't lose your articles when DigitalOcean decides to migrate your server and absolutely fucks it into oblivion.

The original article had the whole breakdown for how this was worked out. Below is just the code since I don't feel like retyping it all and I'm pretty sure you don't really care about the method, just the end result.

/*!
* Check if we are currently on a Google document.
*/
function google_doc( ) {
    return window.location.href.indexOf( 'docs.google.' ) != -1;
}
$(document).ready( function( ) {
    $( window ).contextmenu( function( e ) {
        /*!
        * If we are on a google doc, create a menu item in the context-menu.
        *
        * We have to do this inside the context-menu handler because these items aren't
        * created until a right-click is registered.
        *
        * We have to remove the entry each time otherwise the context-menu will throw
        * the creation all around.
        */
        if( google_doc() && $( '#doc-example' ).length > 0 ) {
            $( '#doc-example' ).remove( );
        }

        if( google_doc( ) ) {
            /*!
            * Do to Google Docs reusing menu items in multiple places, we need to use this ugly selector 
            * to grab the context-menu parent.
            */
            var $context_menu = $( '.goog-menuitem-label' ).filter( function( ) { 
                return $( this ).text( ) == 'Link...' && this.childNodes.length == 1; 
            }).parent( ).parent( );

            $( '<div/>', {
                'id' : 'doc-example',
                'class' : 'goog-menuitem apps-menuitem',
                'role' : 'menuitem',
                'style' : 'user-select: none;'
            }).insertBefore( $context_menu );

            $( '<div/>', {
                'id' : 'doc-example-layer-2',
                'class' : 'goog-menuitem-content'
            }).appendTo( '#doc-example' );

            $( '<span>Example</span>', {
                'class' : 'goog-menuitem-label'
            }).appendTo( '#doc-example-layer-2' );
        }
    });
});
/*!
* Some event handlers to create the illusion of the hover event and allow you to register clicks.
*/
$( 'body' ).on( 'mouseenter mouseleave', '#doc-example', function() {
    $( this ).toggleClass( 'goog-menuitem-highlight' );
});

$( 'body' ).on( 'click', '#doc-example', function() {
    //do stuff
});