Question: I have a really simple page with a form which I'm trying to prevent from sending with jQuery, but the code is surprisingly not working. Any ideas?

```
<!DOCTYPE html>
<html>
   <head>
        <script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
        <script>

            $("#searchForm").submit(function(e){
               e.preventDefault();
         });

    </script>

</head>
<body>
    <form id="searchForm">
      <input name="q" placeholder="Go to a Website">
      <input type="submit" value="Search">
    </form>
    <pre id="response"></pre>
</body>

```

Answer: 
You need to delay the addition of your event-listener function until the browser has finished loading the page. Otherwise those lines of JavaScript get executed before the form element exists, so the function doesn't get attached to it. 

Wrap the event-listener in [jQuery's `.ready()` method](http://devdocs.io/jquery/ready): 

```
$(document).ready(function() {
  $('#searchForm').submit(function(event) {
    event.preventDefault();
  });
});

```
```
$(document).on('submit', function(e){
    e.preventDefault();
});

```