why does the .bind() not work outside the .ready() function?

Question

On click of a button I am showing an alert message. Below is the code that I am using.

<script type="text/javascript">
// $(document).ready(function(){
    $("#clickHere").bind("click",function(){
        alert('clicked');
     });
 //});
 </script>

As the .ready() line is commented, when I click on the button the alert message is not thrown, but if I uncomment those lines the the alert is thrown. Shouldn't the alert message be shown in both the cases as I have added binding to the button on 'click' event?

Answer 1

because at the time the javascript block is parsed, the DOM is not ready, hence the element you reference does not exist yet.