Alter higher level of event's DOM

I need to illustrate some of my events with an SVG (actually a mini timeline for subparts of the event). This SVG should stretch the whole width of the event box. Since that can grow and shrink with zooming I don't know its width, so I declare 100%.

If I put it in content, that will be the much bigger width of my text (with some pretty css gradient to make it look part of the event):

To get it where I need it, I should put it two levels higher, directly into .vis-item, which I simulate here by dragging it in the debugger:

My problem is that there is no way of reaching that part of the DOM. I tried adding a <script> to content, to rearrange it, but it doesn't seem to get run (and it would be an awkward hack). I'd like to have an official way to get it in.

I'd be willing to do it, but I don't know your preference. Mine is write once, so I'd be happy with some hook function, a quick shot solution to just add e.g. bottomContent in RangeItem.prototype.redraw. This could be as simple as if (this.options.massageDOM) this.options.massageDOM(this.dom, itemData); fully under the caller's responsibility.

OTOH I see a solution, probably overkill but maximally coherent with what is already there: an alternate bottomTemplate, and update handling as in Item.prototype._updateContents. If I do all that, we'd have quite a bit of additional code, maybe replicated for several types. In a dynamic scenario, the tag for that should only be added if there actually is something to put in, which many users won't have.

What solution would you prefer me to do? Or is there something like this coming, that I missed?