I like to change Title of a div using onclick function. I a new to .js

function changeTitle() {
    document.getElementById("amul").attr('title', 'Item Added');

}

This is the input button where i have inserted my onclick function

<input type="button" class="button2" id="item1" value="Add to Cart" title="Add to Cart" onClick="addItem_check('item_listing_100','ItemTable','100','Amul Butter','500','g','150.00','1','kg','200.00','2','kg','250.00'); amul.style.backgroundColor='#c2ed5c'; if(this.value=='Add to Cart') {this.value = 'Remove from Cart'}; item1();  "/>

This is the div which i like to change the title

<div class="center_prod_box" id="amul">. . . </div>

I like to change Title of a div using onclick function. I a new to .js

function changeTitle() {
    document.getElementById("amul").attr('title', 'Item Added');

}

This is the input button where i have inserted my onclick function

<input type="button" class="button2" id="item1" value="Add to Cart" title="Add to Cart" onClick="addItem_check('item_listing_100','ItemTable','100','Amul Butter','500','g','150.00','1','kg','200.00','2','kg','250.00'); amul.style.backgroundColor='#c2ed5c'; if(this.value=='Add to Cart') {this.value = 'Remove from Cart'}; item1();  "/>

This is the div which i like to change the title

<div class="center_prod_box" id="amul">. . . </div>

• javascript
• html

• title is not really a standard attribute of div elements although many browsers will interpret it anyway (and often display the title when the element is hovered, like an a title). in html5 this doesn't matter as you can set whatever attributes you damn well please, but i wonder if maybe you are looking to edit the content of the div in question rather than its attributes? – Ennui Commented Sep 25, 2013 at 18:41

3 Answers 3

You're mixing plain JavaScript (getElementById) with jQuery (attr), the two methods are incompatible. Try one of these:

// Plain JS (recommended)
document.getElementById("amul").title = "Item Added";

// Plain JS, may not work in <= IE7
document.getElementById("amul").setAttribute("title", "Item Added")

// jQuery (recommended)
$('#amul').attr('title', 'Item Added');

// You can also get the native JS object from a jQuery object
$('#amul')[0].title = "Item Added";
$('#amul')[0].setAttribute("title", "Item Added")

You may utilize the title property:

document.getElementById("amul").title = "Item Added";

Or, use the setAttribute() method:

document.getElementById("amul").setAttribute("title", "Item Added");

Try this:-

document.getElementById("amul").setAttribute("title", "Item Added");