5

I am trying to create this html block in javascript:

<label>
  <input name="{{ $amenity->name }}" type="checkbox" class="minimal">
  text
</label>

I have:

var checkBox = document.createElement("input");
var label_input = document.createElement("label");
label_input.innerHTML = value.name;
label_input.appendChild(checkBox);

But the result is

<label>
  text
  <input name="{{ $amenity->name }}" type="checkbox" class="minimal">
</label>

and I tried to add the checkbox first and then the text but no success.

Munawir
  • 3,346
  • 9
  • 33
  • 51
  • It’s probably a duplicate of [How to append data to div using javascript?](http://stackoverflow.com/q/5677799/4642212) (see the [answer by Chandu](http://stackoverflow.com/a/5677825/4642212)). – Sebastian Simon Apr 19 '16 at 16:12

1 Answers1

8

Try using document.createTextNode for appending text content to the end of the label.

var checkBox = document.createElement("input");
var label_input = document.createElement("label");
label_input.appendChild(checkBox);
label_input.appendChild(document.createTextNode(value.name));
jeffjenx
  • 17,041
  • 6
  • 57
  • 99