add bootstrap button by javascript

Question

I am trying to add a bootstrap button into a row dynamically. Below is my code. A button is added but it is not bootstrap style.

var cell4 = row.insertCell(3);
var element3 = document.createElement("input");
element3.type = "button";
element3.name = "add";
element3.value="Remove";
element3.class="btn btn-danger btn-xs";
cell4.appendChild(element3);

Can someone tell the right way to do it? Thanks.

Sphvn · Accepted Answer · 2015-03-13 02:34:29Z

3

This would be because element3.class is not a valid property.

You should be using element3.className="btn btn-danger btn-xs" instead

answered Mar 13, 2015 at 2:34

Sphvn

5,4018 gold badges41 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Sphvn Over a year ago

Mark answer as correct if this solved your question, thanks :)

Jenish Rabadiya · Accepted Answer · 2015-03-13 02:36:11Z

1

You should refer className property instead of class property.

function myFunc()
{
  var cell4 = document.getElementById('insertHere');
var element3 = document.createElement("input");
element3.type = "button";
element3.name = "add";
element3.value="Remove";
element3.className="btn btn-danger btn-xs";
cell4.appendChild(element3);
}

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap-theme.min.css" rel="stylesheet"/>

<div id="insertHere"> </div>
<input type="button" value="addButton" onclick="myFunc()" />

answered Mar 13, 2015 at 2:36

Jenish Rabadiya

6,7766 gold badges35 silver badges62 bronze badges

Collectives™ on Stack Overflow

add bootstrap button by javascript

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related