DOM/dom3.html

<!DOCTYPE html>
<html>
<head>
    <title>valueANDstyle</title>
</head>
<body>

    <!-- twist karke samjhte hai -->
    Name:
    <input type="text" id="name" placeholder="name">
    <br><br>
    Mobile Number:
    <input type="tel" id="tele" placeholder="number" pattern="[0-9]{10}">
    <br><br>
    <button id="Submit">Submit</button>

    <p id="para1"></p>
    <button id="button2">Style it!</button>
    
    <script type="text/javascript">
        document.getElementById("Submit").onclick = function() {
            document.getElementById("para1").innerHTML = document.getElementById("name").value + " and " + document.getElementById("tele").value;
        }
        
        document.getElementById("button2").onclick = function() {
            document.getElementById("para1").style.color = "black"; 
            document.getElementById("para1").style.fontSize = "20px"; 
            document.getElementById("para1").style.fontWeight = "bold"; 
        }
    </script>
</body>
</html>