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/