Skip to content

17. Highlighting Changes

HTML provides elements for indicating changes to documents: <del> (deleted), <ins> (inserted), and <s> (strikethrough). These elements help track document revisions, show edits, and indicate content that has been removed or added. They’re useful for version control, collaborative editing, and showing document history.

Marks text that has been deleted:

<p>This is <del>old text</del> updated text.</p>

Marks text that has been inserted:

<p>This is <ins>new text</ins> in the document.</p>

Marks text that is no longer accurate:

<p>Price: <s>$100</s> $80</p>
<p>
Original text <del>deleted portion</del>
<ins>new portion</ins>.
</p>
<p>
Regular price: <s>$99.99</s>
Sale price: $79.99
</p>
<p>
Original: <del>old content</del>
Updated: <ins>new content</ins>
</p>

Indicate when change was made:

<del datetime="2024-01-15">Removed text</del>
<ins datetime="2024-01-16">Added text</ins>

Reference source of change:

<del cite="https://example.com/revision">Old text</del>

Show both deletion and insertion:

<p>
<del>Old version</del>
<ins>New version</ins>
</p>