Cloning .toclone element with id doesn't replace ids

[Archomeda]

Every element inside the .toclone element gets its id updated properly with incremental ids. However, the id of the main .toclone element itself doesn't.

Say, if you use bootstrap tabs where every tabpanel requires an id to have it working properly, you'll probably end up with something like this:

<div class="tabpanel">
    <div role="tabpanel" class="toclone tab-pane" id="tab">
        ...
    </div>
</div>

Clone this once, the tabpanel gets id tab1. Clone it twice from the same tabpanel, you'll end up with tab1 and tab2. So far so good.
However, if you decide to clone from the tabpanel with id tab1, the cloned tabpanel will have its id set to tab11.

Basically, the ids don't get replaced and only get added. After messing around with this enough, you may end up with tab1113411231 instead of tab6 for example.

[cgarveyie]

but it's still a unique identifier, right? That's all the functionality offers. Trying to maintain a sequential list of cloned objects when users can clone and delete objects would be considerably more complex.

[Archomeda]

Not true. If you clone the original tab 11 times, you'll get tab11. But you'll also get tab11 by cloning tab1 once.