title: Custom html tags -- Is there a better way?
body: <p>I am attempting to complete a browser plugin that will analyze text and mark it in some fashion.</p>
  
  <p>Basically, 
  let's say your browsing and you see this come across this text somewhere in your page.</p>
  
  <pre><code>&lt;p&gt;and then Tom Cruise, devoured the planet.&lt;/p&gt;
  </code></pre>
  
  <p>The plugin is scanning the text and will find "Tom Cruise." Once moused over spit AJAX at my server and return a HTML page to be will be displayed in a tool tip.</p>
  
  <p>I originally marked it like so </p>
  
  <pre><code>&lt;p&gt;and then &lt;span class="ajax subtleShadow"&gt;Tom Cruise&lt;/span&gt;, devoured the planet.&lt;/p&gt;
  </code></pre>
  
  <p>Though i am discovering that this can go wrong, if the webpage has strange span css or if its nested in a span with strange things like borders.</p>
  
  <p>My solution was to INVENT a new html tags. like so...</p>
  
  <pre><code>&lt;p&gt;and then &lt;fhwdgads class="ajax subtleShadow"&gt;Tom Cruise&lt;/fhwdgads&gt;, devoured the planet.&lt;/p&gt;
  </code></pre>
  
  <p>Though a quick search lead me to the conclusion that "the internet" would come after me with pitchforks should I do so.</p>
  
  <p>Is there another way to mark inline text creation of custom tags?</p>
  
  <p>EDIT : <a href="http://i.imgur.com/RasEH.jpg" rel="nofollow">Link to a view of the broken button in the nested spans.</a></p>