0

I'm working on a simple chrome extension that displays a string of text when the user opens a new tab. The code is:

<html>
    <head>
        <script type="text/javascript" src="jquery-1.7.2.min.js"></script>
        <script type="text/javascript" src="showText.js"></script>
    </head>
    <body>
        <div id="textDiv">
            <h1 id="actualText"></h1>
        </div>
        <div id="footer">
            <img src="settings.png"/>
        </div>
    </body>
</html>

and the js file

document.addEventListener("DOMContentLoaded", function () {
    var text = "sample text";
    $('#actualText').append(text);
});

This doesn't seem to work when I open a new tab, but when I click refresh on the tab, the text shows up. So I'm guessing the first time the DOMContentLoaded event has already been fired before this code is run? That shouldn't be the case if I load it in the head though right? I'd appreciate any help!

iman453
  • 9,105
  • 16
  • 54
  • 70

1 Answers1

1

If you are using jquery just do:

$(function () {
    var text = "sample text";
    $('#actualText').append(text);
});

This will call the function when the document is ready. Apparently this is equivalent to DOMContentLoaded

Community
  • 1
  • 1
Sidharth Mudgal
  • 4,234
  • 19
  • 25
  • [Check this fiddle](http://jsfiddle.net/Vu5fq/). It does seem to work. Make sure jquery as actually being loaded. – Sidharth Mudgal Nov 22 '12 at 21:19
  • Yeah I think it's a chrome extension thing, more than a JS issue. I think jquery is loaded because when I do refresh, it does show the text. Thanks again :) – iman453 Nov 22 '12 at 21:21