[javascript] How Do I Replace/Change The Heading Text Inside <h3></h3>, Using jquery?

How do I change/replace the <h3> text: "Featured Offers" using javascript to say "Public Offers" instead?

</div>  <!-- FEATURED OFFERS -->
<div class="panel">
   <div class="head">
      <h3>Featured Offers</h3>
   </div>
   <div class="body">
      <table>
         <thead>
            <tr>

This question is related to javascript jquery

The answer is


_x000D_
_x000D_
$("h3").text("context")
_x000D_
_x000D_
_x000D_

Just use method "text()".

The .text() method cannot be used on form inputs or scripts. To set or get the text value of input or textarea elements, use the .val() method. To get the value of a script element, use the .html() method.

http://api.jquery.com/text/


Something like:

$(".head h3").html("Public offers");

jQuery(document).ready(function(){
   jQuery(".head h3").html('Public Offers');
});

try this,

$(".head h3").html("New header");

or

$(".head h3").text("New header");

remember class selectors returns all the matching elements.


If you can select it, you can manipulate it.

Try this:

$(".head h3").html("your new header");

But as others mentioned, you probably want head div to have an id.


you don't - not like this. give an id to your tag , lets say it looks like this now :

<h3 id="myHeader"></h3>

then set the value like that :

myHeader.innerText = "public offers";

You can try:

var headingDiv       = document.getElementById("head");
headingDiv.innerHTML = "<H3>Public Offers</H3>";

Give an id to h3 like this:

<h3 id="headertag">Featured Offers</h3>

and in the javascript function do this :

document.getElementById("headertag").innerHTML = "Public Offers";