Add inline style using Javascript

Question

I m attempting to add this code to a dynamically created div element  style    width 330px float left      The code in which creates the dynamic div is   var nFilter   document createElement  div    nFilter className    well   nFilter innerHTML     lt label gt     sSearchStr     lt  label gt      My idea is to add the style after  lt  div class  well  but i don t know how i d do it

User · Accepted Answer

nFilter style width    330px   nFilter style float    left    This should add an inline style to the element

User · Answer

A few people have an example using setAttribute which I like  However it assumes you don t have any styles currently set  I would maybe do something like   nFilter setAttribute  style   nFilter getAttribute  style       width 330px float left       Or make it into a helper function like this   function setStyle el  css     el setAttribute  style   el getAttribute  style           css      setStyle nFilter   width 330px float left       This makes sure that you can add styles to it continuously and it won t remove any style currently set by always appending to the current styles  It also adds an extra semi colon so that if there is a style ever missing one it will append another to make sure it is fully delimited

User · Answer

Use cssText  nFilter style cssText     width 330px float left

User · Answer

var div   document createElement  div    div setAttribute  style    width 330px  float left    div setAttribute  class    well    var label   document createElement  label    label innerHTML    YOUR TEXT HERE   div appendChild label

User · Answer

Using jQuery      nFilter  attr  style   whatever      Otherwise    nFilter setAttribute  style    whatever      should work

User · Answer

Try something like this  document getElementById  vid-holder   style width 300    px

User · Answer

You can do it directly on the style   var nFilter   document createElement  div    nFilter className    well   nFilter innerHTML     lt label gt   sSearchStr   lt  label gt        Css styling nFilter style width    330px   nFilter style float    left       or nFilter setAttribute  style    width 330px float left

User · Answer

If you don t want to add each css property line by line  you can do something like this    x000D   x000D  document body insertAdjacentHTML  afterbegin    lt div id  div  gt  lt  div gt     x000D   x000D      x000D     Add styles to DOM element x000D      element DOM element x000D      styles object with css styles x000D      x000D  function addStyles element styles   x000D    for id in styles   x000D      element style id    styles id   x000D      x000D    x000D   x000D     usage x000D  var nFilter   document getElementById  div    x000D  var styles     x000D    color   red  x000D     width   100px  x000D     height   100px  x000D     display   block  x000D     border   1px solid blue  x000D    x000D  addStyles nFilter styles   x000D   x000D   x000D

User · Answer

You can try with this  nFilter style cssText    width 330px float left      That should do it for you

User · Answer

you should make a css class  my style then use  addClass   mystyle

[javascript] Add inline style using Javascript

Examples related to javascript

Examples related to css

Examples related to innerhtml