custom elements

I just got an idea:

I want my users to be able to heavily "mark up" their text by inserting various [spans] with unique id's and classes. I've created a plugin that hooks into the STYLE system and applies uniqly id'ed spans to the selected text.

But I've found that CKEDITOR doesn't take care of all the nasty nesting issues that I wish it did: if I put a [span] inside another [span], they will be improperly nested -- here I put span2 inside of span1:

<span id=1>text text 
  <span id=2>text text</span>(ambiguous closing) 
  text text
</span>(ambiguous closing)

It should look like this:

<span id=1>text text </span>(close span1)
   <span id=2>text text</span>(close span2)
<span id=1>text text</span>(close span1)

I thought CKEDITOR would handle this, but it seems to get messed up by the fact that the span's are the same element, even though they have unique id's.

My thought is: why not create custom elements, so that each unique id becomes a unique element as well? Like this:

<span1>text text 
   <span2>text text</span2>
text text</span1>

There's no ambiguity in the closing tags since they are unique.

I know that I need some JS magic to make custom elements work in older IE. Is there any other reason not to do this? It seems like it'll solve a lot of problems...?