user3949359
user3949359

Reputation:

JQuery functions don't work. Ready handler included

This simple block of code won't execute in my browser for some reason. None of the JQuery functions execute, even with a ready handler on.

<!DOCTYPE html PUBLIC>
<html>
  <head>    
    <title></title>
  </head>
  <body>
    <button id="btn">click me</button> 

    <script type="text/javascript">

        $(document).ready(function(){
           $('#btn').css("font-size", "1.5em");
           $('#btn').click(function(){
              $('#btn').hide();
           });
        });

    </script>
    <script src=
    "//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" type=
    "text/javascript">
</script>
  </body>
</html>

Upvotes: 0

Views: 183

Answers (3)

damare
damare

Reputation: 201

The ready handler is called after jquery is fully initialized, only then you can be sure all jquery features will do what they are supposed to.

Upvotes: 0

T McKeown
T McKeown

Reputation: 12847

Have the .js file loaded before executing the jQuery calls:

<!DOCTYPE html PUBLIC>
 <html>
   <head>    
     <title></title>
   </head>
   <body>
   <button id="btn">click me</button> 
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js" />

   <script type="text/javascript">

    $(document).ready(function(){
       $('#btn').css("font-size", "1.5em");
       $('#btn').click(function(){
          $('#btn').hide();
       });
    });

   </script>

Upvotes: 3

damare
damare

Reputation: 201

The "http" is missing in the URL to jquery.

Upvotes: 0

Related Questions