onclick calling hide-div function not working

Question

I've been fighting with this simple piece of code forever. I'm trying to use a <button> to call a simple JavaScript function to hide a <div>.

HTML:

<button type="button" onclick="close('wrong')">OK</button>

JavaScript:

function close(ID)
{
    document.getElementById(ID).style.display="none";
}

I'm sure it's something really simple, I just can't, for the life of me, find it.

Answer 1

Try changing the close function name to something else like closeit because it may be confusing it with the window.close() function.

Answer 2

Let's do something in jQuery:

<button type="button" id="btn">OK</button>
<div id="myDiv">Div's contents here</div>

Now, you need just use the code below to do what you want:

<script type="javascript">
$(document).ready(function(e) {    
   $("#btn").click(function () {
      $("#myDiv").hide();
   });
});
</script>

Notice: you can have some properties for hide() function: Fast and slow. This will affect on the speed of hiding action.

$("#myDiv").hide("slow");

I hope this can help you.

Answer 3

Try document.getElementById('wrong').setAttribute('style', 'display:none');