How to change background color when button is clicked in JavaScript?

Asked 19-Jul-2021
Viewed 305 times
Ask Question

0

How to change background color when button is clicked in JavaScript?

Ravi Vishwakarma
asked by Ravi Vishwakarma in web application
Answer Add comment

1 Answer

2

<!DOCTYPE html>

<html lang='en' xmlns='http://www.w3.org/1999/xhtml'>

<head>

    <meta charset='utf-8' />

    <title>JS Demo</title>

    <style type='text/css'>

        * {

            margin:10px;

            padding:0px;

        }

        select {

            width:100px;

        }

    </style>

    <script type='text/javascript'>

        function changeColor() {

        var name = window.document.getElementById('color');

        //alert('Your selected color is : ' + name.value);

        name.style.backgroundColor = name.value;

        window.document.body.style.backgroundColor = name.value;

        window.document.getElementById('sub').style.backgroundColor = name.value;

    }

    </script>

</head>

<body>

    <span>Select Color name  : </span>

    <select name='color' id='color' >

        <option value='red'>Red</option>

        <option value='yellow'>Yellow</option>

        <option value='white'>White</option>

        <option value='pink'>Pink</option>

        <option value='green'>Green</option>

    </select>

    <button type='button' onclick='changeColor()' value=' Submit ' id='sub'> Submit </button>

</body>

</html>
Add comment
Ethan Karla
answered 22-Jul-2021 by Ethan Karla
Ads
Ads