when clicking a button it deletes everything

Question

note new to JavaScript

when clicking the button to write out the text from my input box it prints out the text but deletes everything else

JavaScript code

let = Text
document.getElementById("Button7").onclick = function () {
    Text = document.getElementById("myText").value;


    
    document.write(Text)

}

HTML code

<!DOCTYPE html>
<html>
<head>
    
    <link rel="stylesheet" href="style.css">
</head>
<body>
    
    <input type="text" id="myText" placeholder="enter text"> <br>
    <button id="Button7">enter</button>
    



    <script type="text/javascript" src="index.js"></script>
<h1>my first website test</h1>

</body>
</html>

Welcome to Stack Overflow! Note that when initialising a variable in JavaScript, you shouldn't use the equals sign with `let`. — BestCoderBoy, Jan 21 '23 at 23:26
@BestCoderBoy Not only is it not necessary, but it is syntactically incorrect. — Michael M., Jan 21 '23 at 23:29
There is a syntax with the let statement: `let = Text` should be `let Text = "lorum ipsum or whatever the text is to show on page"`. — traktor, Jan 21 '23 at 23:56

score 0 · Answer 1 · answered Jan 21 '23 at 23:24

You can display the value of the input in a <p> element by setting its textContent. Do not use document.write.

document.getElementById("Button7").addEventListener('click', function() {
    document.getElementById("result").textContent = document.getElementById("myText").value;
});

<input type="text" id="myText" placeholder="enter text"> <br>
<button id="Button7">enter</button>
<p id="result"></p>

when clicking a button it deletes everything

1 Answers1