Using jQuery to override the content of a div [closed]

In some instances, I’ll run a delayed init function in a setTimeout like this:

var delay = setTimeout(function() {
    jQuery("").html("<p> ... </p>");
}, 100);

In the event that something is overwriting the html of that paragraph block on page load, this function will run 100 milliseconds after that, making yours the last change to the paragraph. 100 milliseconds is rather quick, so with other elements on the page loading, users may or may not notice the change.

I generally use this type of load with the elements hidden via CSS, and then fading them in when they’ve been “loaded” if there are a lot of elements that will will change in shape or size, e.g. going from three words to three paragraphs would make the page jump, so I may fade it in nicely instead.

Also, since you’re calling .html() on the paragraph element, you don’t need to include the paragraph tags within since the html you would be setting is already wrapped by paragraph tags. If you’re just changing text, you could use .text() instead. However, if you’re including line breaks or span elements within the paragraph, then .html() would be appropriate.