---
schema_version: "1"
id: 637a159f3484697740a308ae394eebc6541f17e46229ee38b3c04c2867629ea8
title: Modifying DOM Elements Managed by
collection: developer
version: current
locale: en-us
portal_url: https://docs.salesforce.com/developer/current/en-us/platform/aura-platform/guides/aura/js/js-dom-modify-framework.md
canonical_url: https://developer.salesforce.com/docs/platform/aura-platform/guide/js-dom-modify-framework.html
source_site: developer.salesforce.com
content_type: documentation
content_hash: 2a75bbd1117f6948dfab5a3800079969fa82c79ad9416be8961b1c2679f40e40
products:
  - Lightning Aura Components Developer Guide
  - Platform Developer Content
---

# Modifying DOM Elements Managed by

The framework creates and manages the DOM elements owned by a component. If you want to modify these DOM elements created by the framework, modify the DOM elements in the handler for the component’s `render` event or in a custom renderer. Otherwise, the framework will override your changes when the component is rerendered.

For example, if you modify DOM elements directly from a client-side controller, the changes may be overwritten when the component is rendered.

You can read from the DOM outside a `render` event handler or a custom renderer.

The simplest approach is to leave DOM updates to the framework. Update a component’s attribute and use an expression in the markup. The framework’s rendering service takes care of the DOM updates.

You can modify CSS classes for a component outside a renderer by using the `$A.util.addClass()`, `$A.util.removeClass()`, and `$A.util.toggleClass()` methods.

There are some use cases where you want to perform post-processing on the DOM or react to rendering or rerendering of a component. For these use cases, there are a few options.

-   **[Handle the render Event](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-render-handler.md)**  


    When a component is rendered or rerendered, the `aura:valueRender` event, also known as the `render` event, is fired. Handle this event to perform post-processing on the DOM or react to component rendering or rerendering. The event is preferred and easier to use than the alternative of creating a custom renderer.

-   **[Create a Custom Renderer](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-renderers.md)**  


    The framework’s rendering service takes in-memory component state and creates and manages the DOM elements owned by the component. If you want to modify DOM elements created by the framework for a component, you can modify the DOM elements in the component’s renderer. Otherwise, the framework will override your changes when the component is rerendered.


**See Also**  


-   [Modifying DOM Elements Managed by External Libraries](https://developer.salesforce.com/docs/platform/aura-platform/guide/js-dom-modify-external.md)
-   [Using Expressions](https://developer.salesforce.com/docs/platform/aura-platform/expr/expr-overview.md)
-   [Dynamically Showing or Hiding Markup](https://developer.salesforce.com/docs/platform/aura-platform/js-cb/js-cb-show-hide-markup.md)