JQuery replace contents of div with .text() not working

Question

I have a div with text that I'm trying to replace using Javascript. It works in JFiddle, but not in my Javascript and HTML files for some reason. I can't understand why.

Here's a link to the JSFidle: https://jsfiddle.net/ZEZEME/wgt0ayqe/1/

Here's my actual code:

test.html

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
    <script src="test.js"></script>
</head>
<body>
    <div id="parkLinks"><span></span></div>
</body>
</html>

test.js

$('#parkLinks span').text("Hi I am replace");

As you can see, it's very simple, but it doesn't work. The page is empty instead of showing "Hi I am replace"

The element doesn't exist yet, at the point in time you are executing your method — Taplar, May 23 '19 at 18:06

mikeb · Accepted Answer · 2019-05-23T18:07:27.767

0

Your test.js is running before the page is loaded, try this in test.js:

(function(){
  $('#parkLinks span').text("Hi I am replace");
})()

You can also use JQuery's document.ready: http://learn.jquery.com/using-jquery-core/document-ready/

// A $( document ).ready() block.
$( document ).ready(function() {
    console.log( "ready!" );
});

edited May 23 '19 at 18:07

answered May 23 '19 at 18:06

mikeb

10,578
7
62
120

This is a duplicate. – Taplar May 23 '19 at 18:06
That works beautifully. Thanks so much! – user10844328 May 23 '19 at 18:13

JQuery replace contents of div with .text() not working

1 Answers1