Question

First time post; long time reader. I’ve come across this problem and I now know the cause with no end result/fix that I could find. Apologies in advance if this has been answered previously.

I have some data in a php that gets appended via the ajax command within jQuery (JSON). This displays correctly, taking on the particular CSS assigned and such.

I have a time displayed which shows ’10 minutes ago’ or however long it was posted, but I am trying to get it to display the actual date/time on hover. This is the end product but to get to this point I’m just trying to assign a CSS for visual testing to make sure it does work.

The mouseover command can happen at any point so I can’t do it once the JSON data is appended.

$("span.post-name").mouseover(function () {
    $(this).css("color","red");
});

This function does work on the same span put directly into the HTML, but not on data that is built. Any help would be much appreciated..

Answer 1

Is the problem with adding a function to content that has been dynamically added? If so, then you would want to use .on() and have it look like so:

$("body").on("mouseenter", "span.post-name" function(event) {
   ("span.post-name").css("color", "red");
});