Recently, I attempted to position a paragraph absolutely in relation to an input element.
My goal is to conceal the paragraph when the input has a value, and reveal it when the input is empty.
Here is the code snippet I created, however, it doesn't seem to be functioning as expected. Any advice on how to improve this? Thank you.
var x = document.getElementById("searchBtn").value;
document.getElementById("searchBtn").addEventListener("focus", myFunction3);
function myFunction3() {
if (x == "") {
document.querySelector(".mypara").style.visibility = "visible";
} else {
document.querySelector(".mypara").style.visibility = "hidden";
}
}<input id="searchBtn">
<div class="mypara">mypara</div>