Sn1perSkkN
Sn1perSkkN

Reputation: 113

Can't get to modify a DIV content using javascript

I am trying to edit a DIV contents using a document.getElementById function from an onclick action on a button. I have tried all kinds of methods :

Element.update(element[, newContent]);
document.getElementByName('myElement').innerHTML='New Text';
document.getElementById('supprimerMatiere').innerHTML='New Text';
document.getElementById('supprimerMatiere').innerText='New Text';
document.getElementById('supprimerMatiere').value='New Text';

None of them worked for me. Here's my DIV:

<div name="supprimerMatiere" class="alert alert-warning"><span class="glyphicon glyphicon-warning-sign"></span> Old Text </div>

And here's my button, where I want to put the function to edit my DIV text :

<button onclick="document.getElementByName('supprimerMatiere').innerHTML='New Text';" class="btn btn-default btn-xs" data-title="Supprimer" data-toggle="modal" data-target="#delete" data-placement="top" rel="tooltip"><span class="glyphicon glyphicon-trash"></span></button>

Please help, I'm stuck with this for 3 days and didn't find a solution on the internet.

Upvotes: 0

Views: 64

Answers (3)

Yogesh Prajapati
Yogesh Prajapati

Reputation: 4870

there is no such method named getElementByName(element)

so its better use id attribute and use getElementById or getElementsByName(name)[index]

here is test Fiddle

Upvotes: 0

Umut Seven
Umut Seven

Reputation: 408

But the text inside a span, like so:

<span class="glyphicon glyphicon-warning-sign">Old Text</span>

Then do:

$(#supprimerMatiere span).text('New Text')

with Jquery.

EDIT: Without Jquery:

document.getElementById("yourspanID").innerHTML = "New Text";

Upvotes: 0

Mritunjay
Mritunjay

Reputation: 25882

That is getElementsByName not getElementByName and it returns an nodelist. Say like bellow

onclick="document.getElementsByName('supprimerMatiere')[0].innerHTML='New Text';"

Upvotes: 1

Related Questions