0

My jquery event function is not working .This is my jquery code which I have saved in jquery.js file:

$("h1").click(function(){
  $(this).text("I have been changed")
})

Following is the corresponding html code where I have link jquery.js file

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title>jquery</title>
    <script
   src="https://code.jquery.com/jquery-3.4.1.js"
   integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="
   crossorigin="anonymous"></script>
  <script src="jquery.js"></script>
  <link rel="stylesheet" 
href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" 
integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" 
crossorigin="anonymous">
  </head>
  <body>
    <h1>Selecting with jquery</h1>
    <ul>
      <li>understanding</li>
      <li>analyzing</li>
      <li>implementing</li>
    </ul>

  </body>

  • 1
    the code is correct but you can check if jquery.js is load , press ctrl + u in browser and then click on the jquery.js link and see if is loaded correctly – Ivan Dec 11 '19 at 07:23

1 Answers1

0

Your jQuery is loading before the document is ready. Wrap up your jQuery code with document.ready so that it would execute after the document is loaded

$(document).ready(function(){
    $("h1").click(function(){
      $(this).text("I have been changed")
    })
});
mustafaj
  • 305
  • 1
  • 12