HTML Deleted and Inserted Text

HTML provides two elements for showing changes in content: the <del> element and the <ins> element. The <del> element represents text that has been deleted, while the <ins> element represents text that has been inserted.

These elements are useful for showing updated prices, corrections, content revisions, document changes, and other situations where users need to see what was removed and what was added.

What Is HTML Deleted Text?

The <del> element represents content that has been removed from a document.

For example, <del>₹999</del> represents a deleted or replaced price.

Browsers usually display content inside <del> with a strikethrough.

A simple example is:

<p>Old Price: <del>₹999</del></p>

The original price remains visible, but the strikethrough indicates that it is no longer the current value.

HTML <del> Syntax

The basic syntax is:

<del>Deleted Text</del>

For example:

<p>The old price was <del>₹1,499</del>.</p>

The <del> element does not remove the text from the webpage. Instead, it marks the text as deleted.

What Is HTML Inserted Text?

The <ins> element represents content that has been added to a document.

Browsers usually display inserted text with an underline.

For example, <ins>₹799</ins> represents newly inserted content.

A simple example is:

<p>The new price is <ins>₹799</ins>.</p>

HTML <ins> Syntax

The basic syntax is:

<ins>Inserted Text</ins>

For example:

<p>Learn <ins>HTML and CSS</ins> from beginner level.</p>

The inserted content is normally displayed with an underline.

Using <del> and <ins> Together

The most common use of these elements is showing old and new information together.

For example:

<p>Price: <del>₹999</del> <ins>₹799</ins></p>

The browser normally displays ₹999 with a strikethrough and ₹799 with an underline.

This is especially useful for displaying discounts.

Complete Example

<!DOCTYPE html>
<html>
<head>
  <title>HTML Deleted and Inserted Text</title>
</head>

<body>

  <h1>HTML Deleted and Inserted Text</h1>

  <p>
    Original Price:
    <del>₹999</del>
  </p>

  <p>
    New Price:
    <ins>₹799</ins>
  </p>

  <p>
    Special Offer:
    <del>₹1,499</del>
    <ins>₹1,199</ins>
  </p>

</body>
</html>

This example clearly shows the original values and their replacements.

HTML <del> vs <s>

The <del> and <s> elements can both produce strikethrough text, but they have different meanings.

ElementPurpose
<del>Represents content that has been deleted
<s>Represents content that is no longer accurate or relevant

For example, if an old price has been replaced, <del>₹999</del> can represent the deleted price.

If an announcement is no longer valid, <s>Registration Open</s> can indicate that the statement is no longer applicable.

HTML <ins> vs <u>

The <ins> and <u> elements can both appear underlined, but their meanings are different.

ElementPurpose
<ins>Represents inserted content
<u>Represents text with a specific non-textual annotation or styling

For example, <ins>New Course Added</ins> indicates that the content was inserted.

Use CSS when you only want to underline text for visual purposes.

Using CSS with <del> and <ins>

You can customize the appearance of deleted and inserted text using CSS.

<style>
  del {
    color: gray;
  }

  ins {
    color: green;
    text-decoration: none;
  }
</style>

<p>
  Price:
  <del>₹999</del>
  <ins>₹799</ins>
</p>

Here, CSS changes the appearance while the HTML elements continue to communicate the meaning of the changes.

Using <del> and <ins> for Content Updates

These elements can also be used when showing changes to an article or document.

For example:

<p>Learn <del>HTML only</del> <ins>HTML, CSS, and JavaScript</ins>.</p>

This makes it clear which information was removed and which information was added.

The datetime Attribute

Both <del> and <ins> support the datetime attribute. It can provide the date or date and time associated with the change.

For example:

<del datetime=”2026-10-06″>Old information</del>

And:

<ins datetime=”2026-10-06″>Updated information</ins>

This can be useful when documenting when a change was made.