---
name: ".up-destroying"
area: "API"
kind: "CSS class"
parent: "up.fragment module"
url: "https://unpoly.com/api/up-destroying"
---
<nav aria-label="Unpoly docs">[All docs](https://unpoly.com/index.md) · [up.fragment module](https://unpoly.com/api/up.fragment.md)</nav>

# .up-destroying

Elements are assigned the `.up-destroying` class before they are [destroyed](https://unpoly.com/api/up.destroy.md) or while they are being removed by a [transition](https://unpoly.com/api/up.morph.md).

If the removal is [animated](https://unpoly.com/api/up.destroy.md#animating-the-removal), the class is assigned before the animation starts.

<nav aria-label="Guides">

- [Learn: Transitions](https://unpoly.com/learn/transitions.md#how-a-transition-plays)

</nav>

## Destroying elements are ignored {#destroying-elements-are-ignored}

Destroyed elements remain attached to the DOM while they are playing out their exit animation. To prevent accidental selection of destroying elements, they are ignored by Unpoly features like [`[up-target]`](https://unpoly.com/learn/targeting-fragments.md) or [`up.fragment.get()`](https://unpoly.com/api/up.fragment.get.md).

Only the low-level DOM helpers in [`up.element`](https://unpoly.com/api/up.element.md) will _not_ ignore elements that are being destroyed.

## Accessibility {#accessibility}

While an element's destruction is animating, the element is also assigned an [`[inert]`](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inert) attribute.

This prevents interaction with the element and hides it from assistive technologies.