How to show mouseover tooltip on selected word on web page using javascript, conditionally?

How to show mouseover tooltip on selected word on web page using javascript? i want to set some conditions

For example:

If page has text <p> I'm Web Designer </p> inside <div id=example> then it should show tool tip on Designer but tooltip should not be shown for designer without adding any span to Designer and designe开发者_如何学JAVAr. i want to select autuomatically

I have to set include and exclude keywords to pick, or notpic tool tip . and matter of all tooltips for all i want to write in another html file not in same page.

    You have to do it using css and javascript but following is the simple thing you can do for same result.
<a  title="Designer" href="javascript:void(0);" >Designer</a>

    Designer

Use the following jQuery to wrap an anchor tag around the word "designer" (inspiration found here):

$('#example').html(
  $('#example')
    .html()
    .replace(
      /(designer)/g,
      '<a href="#" class="normalTip" title="Some Text">$1</a>'
    )
);

Then use (for example) the aToolTip library to display the tip.

Here's a Fiddle: http://jsfiddle.net/m2x6J/