Trying To Make A Div Disappear With Javascript

Question

I am trying to make a div disappear with javascript. It just doesn't work. What am I doing wrong?

Solution 1:

You are running the script before the DOM has loaded.

If you put the script after the div, it works

Solution 2:

Try and throw a document ready around your code.

And if you are loading jquery you can just do $('#des').css('visibility', 'hidden'); or $('#des').hide()

<script type="text/javascript">
    $(document).ready(function(){
        $('#des').css('visibility', 'hidden');
    });
</script>

Solution 3:

You are trying to get the element with id = "des", before it's created.

<div id="des">
    Text.
<a href="">link</a>

</div>

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script type="text/javascript">

document.getElementById("des").style.visibility = "hidden";

</script>

This should work.

Baca Juga

Solution 4:

this worked for me when I placed the javascript code in a function and load it when the body loads e.g

<script>
  function func(){
    document.getElementById("der").style.visibility = "hidden";
  }
</script>

<body onload=func()>
  <div id="der">
    test
  </div>
</body>

Solution 5:

You should wrap the script in a $(document).ready block because you are calling the script before the DOM is loaded.

So,You will have to do it like this

<script type="text/javascript">
   $(document).ready(function() {
     document.getElementById("des").style.visibility = "hidden";
   });   
</script>

Html5 Guru