How to change inner text of button in html using JS?

Asked 19-Jul-2021
Viewed 532 times

1 Answer


1

We will use the innerHTML property of html for changing the button text.

Syntax 

    element.innerHTML = naw-value;
<!DOCTYPE html>

<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>
<head>
    <meta charset='utf-8' />
    <title></title>
</head>
<body>
    <p>Click on button then change the inner data of button </p>
    <button id='btn' onclick='changeData()'>Click Me</button>
    <script>
        var i = 0;
        function changeData() {
            document.getElementById('btn').innerHTML = 'You click me ' + (++i) + ' times';
            var x = Math.floor((Math.random() * 1000) + 999);
            var col = '#bf' + x;
            document.body.style.backgroundColor = col;
        }
    </script>
</body>
</html>