how can url be hidden in hyperlink when mouse hover

Don't put the URL in the href (or keep it href="#") and attach a JavaScript function to the onclick event which puts the actual link in the a element. This way you won't see the actual URL when hovering over the link but the link will be inserted when the user actually clicks.

This way you can easily hide url when mouse hover on hyperlink.

Simply add one id on anchor link.

HTML

<a href="url" id='no-link'>Hyperlink</a>

Jquery code

$(document).ready(function () {
      setTimeout(function () {

            $('a[href]#no-link').each(function () {
                var href = this.href;

                $(this).removeAttr('href').css('cursor', 'pointer').click(function () {
                    if (href.toLowerCase().indexOf("#") >= 0) {

                    } else {
                        window.open(href, '_blank');
                    }
                });
            });

      }, 500);
});

Here is demo link https://jsfiddle.net/vipul09so/Lcryjga5/