I don't know why you got downvoted because this is a good idea.
The only criticism I have is that usually the dotted underline is associated with adwords on some sites. I don't know if there's a better way to do it. Superscript question marks at the end of the phrase?
There's a built-in HTML tag for this that traditionally uses the dotted underline. Looks like it doesn't do that on all browsers, though, these days, but it's a CSS tweak to add it. Behavior also seems worse than it used to on some browsers—safari makes you hover for a little to see the expanded definition, while I recall clicking to see it before, which is better.
There's also the <details> element: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/de... It works quite nicely but is a block element by default. You can override that with some CSS (display: inline or inline-block) and style it to look more like a regular piece of inline content. Pretty useful IMO!