jQuery external hide not working

Question

Hi I have a problem using hide my code is same to other but it's not working

jq.php;

<!DOCTYPE html>
<html lang = "en">
<head>
<meta charset = "utf-8">
<title>jQuery</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src = "js/external.js" ></script>

</head>
<body>
<p id="wawa" >Welcome Roy Gallardo !!</p>
</body>
</html>

external.js

$('#wawa').click(function(){
$('#wawa').hide();
});

possible duplicate of [Why does jQuery or a DOM method such as getElementById not find the element?](http://stackoverflow.com/questions/14028959/why-does-jquery-or-a-dom-method-such-as-getelementbyid-not-find-the-element) — Scimonster, Nov 28 '14 at 13:48

score 0 · Answer 1 · answered Nov 28 '14 at 13:47

0

You have to wait the DOM to be ready :

$(document).ready(function(){
    $('#wawa').click(function(){
        $('#wawa').hide();
    });
});

answered Nov 28 '14 at 13:47

Brewal

7,589
1
22
35

score 0 · Answer 2 · answered Nov 28 '14 at 13:47

0

have you also wrapped your jquery code from your external into the :

$(document).ready(function(){

});

if you dont do this, jquery might not have loaded

answered Nov 28 '14 at 13:47

Max Bumaye

1,003
10
16

Ty for answering I get it now – Majikero Gallardo Nov 28 '14 at 14:01

score 0 · Accepted Answer · answered Nov 28 '14 at 13:49

As the others have said, you need to wait until the DOM is ready by using $(document).ready().

Alternatively, you can put the script at the end of the HTML page:

<!-- ... -->
<body>
    <p id="wawa" >Welcome Roy Gallardo !!</p>
    <script src="js/external.js"></script>
</body>
</html>

jQuery external hide not working

3 Answers3