JavaScript – innerText Property

JavaScript – innerText Property is used to write the dynamic text on the html document. It sets or returns the text content of the specified node, and all its descendants. Here, text will not be interpreted as html text but a normal text.

The innerText property returns just the text, without spacing and inner element tags.

If you set the innerText property, any child nodes are removed and replaced by a single Text node containing the specified string.

Syntax

Return the text content of a node:

node.innerText

Set the text content of a node:

node.innerText = text

Property Values

ValueTypeDescription
textStringSpecifies the text content of the specified node.
JavaScript – innerText Property Values

Return Value

A DOMString representing the rendered text content of an element.

InnerText is used when there is a need to add or retrieve plain text content.

Example

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>JavaScript - innerText Property Example</title>
</head>

<body>
    <p>Click the button get the text content of the button element.</p>

    <button onclick="myFunction()" id="myBtn">Try it</button>

    <p id="demo"></p>

    <script>
        function myFunction() {
            var x = document.getElementById("myBtn").innerText;
            document.getElementById("demo").innerText = x;
        }
    </script>
</body>

</html>