How to make a button visible by clicking another button?

Question

How can I make the button save visible when I click the edit button? This is my code so far, but it happends nothing. I'm working in a jsp

   <INPUT TYPE="BUTTON" VALUE="Edit" ONCLICK="btnEdit()" class="styled-button-2">
    <INPUT TYPE="BUTTON" VALUE="Save" ONCLICK="btnSave()" class="styled-button-2" style="visibility:hidden;" id="save">

    <SCRIPT LANGUAGE="JavaScript">
        function btnEdit()
        {
            {document.getElementsById("save").style.visibility="visible";}

        }    
     </script>

Answer 1

DEMO

It is considered bad practice to add onclick in your html, and you miss-spelled a method. You should equally avoid adding your css in your html as well.

HTML:

<INPUT TYPE="BUTTON" VALUE="Edit" class="styled-button-2" id="edit">
<INPUT TYPE="BUTTON" VALUE="Save" class="styled-button-2" id="save">

JS:

var edit = document.getElementById("edit");
var save = document.getElementById("save");

edit.onclick = function() {
    save.style.visibility = "visible";

}

CSS:

#save {
    visibility: "hidden";
}

Answer 2

Must be a long day.

You have a misspelling.

Not right

document.getElementsById

Right Way

document.getElementById

Answer 3

document.getElementById("save").style.visibility="visible";

使用getElementById而不是getElementsById

Answer 4

Probably a simple error, but you wrote getElementsById not getElementById , which meant you were trying to get more than one element, when infact you only need to get the "save" button.

<SCRIPT LANGUAGE="JavaScript">
    function btnEdit()
    {
        {document.getElementById("save").style.visibility="visible";}

    }    
 </script>

Side note: You may want to tidy your code:

<SCRIPT LANGUAGE="JavaScript">
    function btnEdit()
    {
        document.getElementById("save").style.visibility="visible";
    }    
</script>