How to output a Rich Text Link to an Entry as a tooltip?

I have a Glossary channel on my site, with Term and Definition fields. I would like Terms to display their definitions throughout the site…whenever so assigned by the content editor.

I currently have Rich Text fields allowing editors to create links from Terms to their Definitions by using Link to an Entry. This is not great in terms of UX as it forces sends site visitors to the main Glossary index page to view the Definitions; I’d like to implement a hover text for the Terms that shows the Definition right there, wherever the visitor is reading.

How can I filter these rich text fields in the templates to check for links to Glossary entries and output a hover text instead of a link? I haven’t written any custom plugins or filters (yet), so I’m looking for pointers in the right direction.

Any other approaches that might solve my problem are welcome.

Thanks in advance for your help.

$("a[href*='route/to/definitions/']").each(function(){
    var $element = $(this);

    // ajax load content and place content in DOM somewhere
    $.get( $element.attr('href'), function(data) {
        $element.attr('data-definition') = data;
    });

    // click handler to prevent default link behavior
    $element.on('click', function(event){
        event.preventDefault()
    });

    // hover handler to display/hide definition
    $element.hover(displayDefinition, hideDefinition);
});