JSFiddle - React, Tailwind, and code Playground
HTML
<div id='firstname'>Aj</div>
<script>
/* by: Ajay Gupta */
var headerUri = 'http://stackoverflow.com/questions/3319/css-background-color-in-javascript/32375473#32375473',
headerCaption = 'CSS background color in JavaScript';
document.body.insertAdjacentHTML(
'afterBegin',
'<a href="' + headerUri + '" '
+ 'target="_blank" '
+ 'onmouseover="this.style.opacity=\'.95\'" '
+ 'onmouseout="this.style.opacity=\'1\'" '
+ 'style="'
+ 'background-color: black;'
+ 'background-image: linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
+ 'background-image: -webkit-linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
+ 'background-image: -moz-linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
+ 'background-image: -o-linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
+ 'background-image: -ms-linear-gradient( top, rgba( 255, 255, 255, .3), rgba( 255, 255, 255, 0) );'
+ 'border: 1px solid black;'
+ 'border-radius: 2px;'
+ 'color: white;'
+ 'display: block;'
+ 'font: normal 15px/26px Helvetica, Verdana, Tahoma;'
+ 'height: 26px;'
+ 'left: 0px;'
+ 'opacity: 1;'
+ 'overflow: hidden;'
+ 'padding: 2px 8px;'
+ 'position: fixed;'
...
CSS
#firstname{
border:1px solid black;
}
JavaScript
var element = document.getElementById('firstname');
element.style.backgroundColor = "green";//Or #ff55ff