Change Content - Javascript

Change html element content using pure javascript author(s): Deepu Mohan Puthrote (WarFox)

HTML

<div id='cmlist_wrapper' class='table-responsive' style='overflow: auto; display: table; position: relative;'>
<table id="cmlist" class="table table-bordered table-striped" cellpadding="2" cellspacing="0">
        <tr>
          <td rel='cmlist_tooltip' title='Test tooltip'>My</td>
        </tr>
        </table>
        </div>

CSS

.tooltip_highlight {
    background-color: #4ac7b5ab !important;
}

#cmlist_tooltip {
  display: none;
  text-align: center;
  color: #000;
  background: #d4d4d4;
  position: absolute;
  z-index: 1001;
  padding: 3px;
  max-height: 85%;
  overflow: auto;
}

#cmlist_tooltip table {
    margin-bottom: 0 !important;
}

JavaScript

/*
        TOOLTIP
    */

    jQuery( function()
    {
        var targets = jQuery( '[rel~=cmlist_tooltip]' ),
            target      = false,
            tooltip = false,
            title       = false;
            min_top = 65;

        targets.bind( 'mouseenter', function()
        {
            target      = jQuery( this );
            tip         = target.attr( 'title' );
            tooltip     = jQuery( '<div id="cmlist_tooltip"></div>' );

            if( !tip || tip == '' )
                return false;

            target.removeAttr( 'title' );
            target.addClass("tooltip_highlight");
            tooltip.css( 'opacity', 0 )
                   .html( tip )
                   .appendTo( 'body' ).fadeIn();

            var init_tooltip = function()
            {
                if( jQuery( window ).width() < tooltip.outerWidth() * 1.5 ) {
                    tooltip.css( 'max-width', jQuery( window ).width() / 2 );
                } else {
                    tooltip.css( 'max-width', 340 );
                }
                /*

                original, with top/bottom position
                var pos_left = target.offset().left + ( target.outerWidth() / 2 ) - ( tooltip.outerWidth() / 2 ),
                    pos_top      = target.offset().top - tooltip.outerHeight() - 20;

                if( pos_left < 0 )
                {
                    pos_left = target.offset().left + target.outerWidth() / 2 - 20;
                    tooltip.addClass( 'left' );
                }
                else
                    tooltip.removeClass( 'left' );

                if( pos_left + tooltip.outerWidth() > jQuery( window ).width() )
                {
                    pos_left = target.offset().left - tooltip.outerWidth() + target.outerWidth() / 2 + 20;
                    tooltip.addClass( 'right' );
                }
                else
                    tooltip.removeClass( 'right' );

                if( pos_top < 0 )
                {
      ...