Using jQuery to replace text inside H3 header

问题:

I tried to keep the code as simple/clean as possible. There is an h3 inside of two DIVs. The top DIV has an ID, the inner DIV a unique class.

$("#Events .event-header h3").html("your new header");

I also tried:

$("#Events .event-header h3").text("your new header");

Neither work. When I try them in the Chrome console, it tells me that the element I'm referencing is undefined and it doesn't know what text to target. The DIV structure couldn't be more simple and clear. I don't know how else to reference the h3 tag.

Any tips? (I've fixed the typo in the .event-header class - Apparently, posting comments instead of doing that previously is a grave sin. Happy Halloween?)

回答1:

Your class is .event-header not .events-header

There is an extra "s" at events.

So try this

$("#Events .event-header h3").text("your new header");

Fiddle

回答2:

Maybe you have conflict in your sites jquery using $ sign? Why dont you try wrapping it with this ready statement instead

jQuery(document).ready(function($){
  $("#Events .events-header h3").text("your new header");​
});