Should I use the [`data-*` attributes][1] for this or is there a more idiomatic way?
---
For context, I'm trying to convert annotated legal PDF documents to HTML. Certain parts of these documents are crossed out when a new amendment is added, timestamped, and a "sticky note" directs readers to the section in the new amendment that supersedes it. My goal is to create a sort of "time machine" (or version controlled) document where one specifies a date, and the document will be rendered with only the parts that would have been in effect at that time.
For example, if this was a quote from one of the PDFs:
<sup>From Wikipedia's [Gall's Law](https://en.wikipedia.org/wiki/John_Gall_(author)#Gall's_law) article.</sup>
> <s>Complex systems are the best way to start a project.</s> (See `amendment 1`, 7/30/2024)
>
> (`amendment 1`, 7/30/2024) A complex system that works is invariably found to have evolved from a simple system that worked. A complex system designed from scratch never works and cannot be patched up to make it work. You have to start over with a working simple system.
My naive initial solution would be something like this:
```html
<p data-date-added="3/9/2021" data-superseded-by-amendment="1">
Complex systems are the best way to start a project.
</p>
<!-- ... lots of other stuff ... -->
<p data-date-added="7/30/2024" data-amendment-id="1">
A complex system that works is invariably found
to have evolved from a simple system that worked.
A complex system designed from scratch never works
and cannot be patched up to make it work. You have
to start over with a working simple system.
</p>
```
[1]: https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes