jQuery .append() does not work from .js file

Question

I have the following line of code:

$('#text').append('<h2 style="color:white">afdghadfg</h2>');

If I paste this code inside of a script tag in the html, it works fine. However, when placed inside a .js file it does nothing.

Know that the .js file has plenty of other working javascript and jQuery code, it is only this line that won't work.

Answer 1

Try this in your JS file:-

$(document).ready(function(){
    $('#text').append('<h2 style="color:white">afdghadfg</h2>');
});

Answer 2

Could be the context you are putting it. Make sure it's not wrapped in a function and directly executable. Also check the JavaScript console (Firebug / CDT) to see if there are any errors.

Another thing to check is if it's getting executed before DOM ready, but I can't really tell you without seeing more code.