CODEWITHSUNDEEP
javascripthtmlcss
Dr. Banana
Dr. Banana

Reputation: 435

change html attribute with javascript

I have the following code.

<li class="source" data-toggle="tooltip" data-placement="top" id="content1" title="" data-original-title="Test">Test Server 1</li>

I'm trying to change the content of data-original-title using the following code:

document.getElementById('content1').style["data-original-title"] = 'Online';

Am I doing something wrong?

Upvotes: 6

Views: 4828

Answers (5)

Jayaram
Jayaram

Reputation: 6606

use setAttribtute()

document.getElementById("content1").setAttribute("data-original-title", "Online");

Upvotes: 1

ajm
ajm

Reputation: 20105

data-original-title is an attribute, so you would need to set it as such:

document.getElementById('content1').setAttribute('data-original-title','Online');

Upvotes: 1

Oleksandr T.
Oleksandr T.

Reputation: 77482

You can use .dataset

document.getElementById('content1').dataset.originalTitle = 'Online';
<li class="source" data-toggle="tooltip" data-placement="top" id="content1" title="" data-original-title="Test">Test Server 1</li>

or .setAttribute

document.getElementById('content1').setAttribute('data-original-title', 'Online');
<li class="source" data-toggle="tooltip" data-placement="top" id="content1" title="" data-original-title="Test">Test Server 1</li>

Upvotes: 5

edonbajrami
edonbajrami

Reputation: 2206

Try this one:

document.getElementById('content1').dataset.originalTitle = 'Online';
<li class="source" data-toggle="tooltip" data-placement="top" id="content1" title="" data-original-title="Test">Test Server 1</li>

Upvotes: 0

Martin Slez&#225;k
Martin Slez&#225;k

Reputation: 181

This does not seem to be a style, try this:

document.getElementById('content1').data-original-title = 'Online';

Upvotes: -1

Related Questions