Creating view answer and close answer in multiple choice question


Youtube link - click here


Source code:


<!DOCTYPE html>
<html>

<head>
    <title>
        choose it
    </title>
    <style>
        #answer1 {
            display: none;
        }
    </style>
</head>

<body>
    <div class="question-1">
        <p>In which type of water demand, the minimum average consumption of water takes place?</p>
        <p>a) Fire demand</p>
        <p>b) Institutional and commercial water demand</p>
        <p>c) Domestic water demand</p>
        <p>d) Industrial water demand</p>
        <button onclick="show()">show answer</button>
        <div id="answer1">
            <p> Answer: a</p>
            <div> Explanation: The minimum average water consumption takes place in fire demand. It accounts to 1lpcd which is very less but this water is required in very less duration.
            </div>
        </div>
    </div>
    <script>
        var visible = "none";

        function show() {
            if (visible == "none") {
                document.getElementById("answer1").style.display = "block";
                visible = "block";
                document.getElementsByTagName("button")[0].innerText = "close answer";
            } else {
                document.getElementById("answer1").style.display = "none";
                visible = "none";
                document.getElementsByTagName("button")[0].innerText = "show answer";
            }
        }
    </script>
</body>

</html>

Post a Comment

Post a Comment (0)

Previous Post Next Post