user882670
user882670

Reputation:

Wrap and style a button in a div element using pure JavaScript

I want to wrap the following button inside a div so I can center it:

<button>Bottom</button>

This is what I tried:

var dv = document.createElement('div');
dv.style.textAlign= 'center';

document.getElement('button').parentNode.appendChild(dv);

You can see the Fiddle Here

How can I do this without JQuery or other frameworks?

Upvotes: 0

Views: 213

Answers (2)

T J
T J

Reputation: 43166

You can do

  var btn = document.getElementsByTagName('button')[0];
  var dv = document.createElement('div');
  dv.style.textAlign= 'center';
  btn.parentNode.insertBefore(dv,btn);
  dv.appendChild(btn);

Updated Fiddle

Upvotes: 2

Manwal
Manwal

Reputation: 23846

Use getElementsByTagName instead of getElement

var dv = document.createElement('div');
dv.style.textAlign= 'center';
document.getElementsByTagName('button')[0].parentNode.appendChild(dv);
dv.appendChild(document.getElementsByTagName('button')[0]);

Updated Demo

Upvotes: 0

Related Questions