Hide div onload in javascript

Question

HTML

<div id="b-navbar-fg">
</div> 

JavaScript

<script>
   $(function(){
      $("#b-navbar-fg").hide() // try to hide google navigation bar
   });
</script>

This Function is executing in my google blogger page. But I am not able to hide this id on loading page.

EXAMPLE PAGE

Solution 1

You can use as in following :

JS

window.onload = function() {
  document.getElementById('b-navbar-fg').style.display = 'none';
};

Jquery

$(document).ready(function() {
    $("#b-navbar-fg").hide();
});

Solution 2

Try this code :

window.onload = function() {
  $("#b-navbar-fg").hide();
};

If above code does not work, try this one :

$(document).ready(function() {
    $("#b-navbar-fg").hide();
});

Solution 3

$(document).ready(function() {
    $('#div1').hide();
    $('#preview').on('click', function() {
            $('#div1').toggle(300);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="div1">
First Div Hide
</div>

<div id="div2">
Second Div
</div>

<div id="preview" style="color:#999999; font-size:14px">
<button>Click</button
</div>