How to add html text inside tag?

Question

I am wondering how I can add html text inside tag using javascript. Not class or id that can be added with classList.add('') or setAttribute. For example, I want to add html text 'disabled' inside the button tag like this: <button class="button is-danger" id="reset">Reset</button> to <button class="button is-danger" id="reset" **disabled**>Reset</button>

What would be the code for javascript? Thank you very much in advance

Edit: Disabled is an attribute

so what you actually whant is to disbale the button is it right ? — deveb2020, Feb 25 '21 at 11:25
Is that ok if you set value for that attribute? like `btnEl.setAttribute("disabled", true)` — bird, Feb 25 '21 at 11:26
I didn't know disabled was an attribute - thank you very much — Soyoon Moon, Feb 25 '21 at 11:50

score 0 · Accepted Answer · answered Feb 25 '21 at 11:27

Disabled too is an attribute. Just writing disabled is the same as defaulting it to true.disabled

If you want to add a custom attribute to pick you can and should refer to data attributes here:custom attributes

As an example, you can add these attributes via simple dom-manipulation using setAttribute itself.setting an attribute

score 0 · Answer 2 · answered Feb 25 '21 at 12:07

disabled is also an attribute i.e boolean attribute. If the attribute is present irrespective of the value, its value is always true if any boolean attribute is present. StackOverflow

const first = document.querySelector("#first");
const second = document.querySelector("#second");
const third = document.querySelector("#third");
const fourth = document.querySelector("#fourth");

second.addEventListener('click', () => {
  first.setAttribute('disabled', true);
})

third.addEventListener('click', () => {
  first.setAttribute('disabled', false);
})

fourth.addEventListener('click', () => {
  first.removeAttribute('disabled');
})

<button id="first"> Hello world </button>
<button id="second"> click to disable </button>
<button id="third"> click to disable </button>

<p> If you want to enable the button then you have to remove the attribute completely. Setting the value to false doesn't enable it</p>
<button id="fourth"> click to enable </button>

How to add html text inside tag?

2 Answers2