Adding css elements to javascript?

Question

Here is the piece of code which contains two CSS elements. del and ins

I want to include the whole CSS code into Javascript... But the code is one level above my experience...

Here is the CSS code:

del {
    text-decoration: none;
    color: #b30000;
    background: #fadad7;
}
ins {
    background: #eaf2c2;
    color: #406619;
    text-decoration: none;
}

And here is the piece of code which contains those classes:

convertChangesToXML: function(changes) {
  var ret = [];
  for (var i = 0; i < changes.length; i++) {
    var change = changes[i];
    if (change.added) {
      ret.push("<ins class='diff'>");
    } else if (change.removed) {
      ret.push("<del class='diff'>");
    }

    ret.push(escapeHTML(change.value));

    if (change.added) {
      ret.push('</ins>');
    } else if (change.removed) {
      ret.push('</del>');
    }
  }
  return ret.join('');
},

How to include CSS into Javascript here?

I don't want a separate CSS file ... Because I'm using a third party app called Storyline to create a web page and it's a lot easer to run a javascript code there without a css file

_"I want to include the whole CSS code into Javascript"_ - Why? — Andreas, May 24 '19 at 14:54
The selectors are missing a `.` -> `.del { ... } .ins { ... }` — Andreas, May 24 '19 at 14:55
what do you mean by "include css into Javascript" exactly? I can't work out what you're trying to achieve. — ADyson, May 24 '19 at 14:55
Just to clarify the terminology, what you seem to be talking about are elements, and the CSS rules for those elements, not classes. — DBS, May 24 '19 at 14:56
"I got this code, how can I make it bad?" "But why?" "I want this." — Wimanicesir, May 24 '19 at 14:59
Guys, I know how to style using js ... The problem is how to implement it on this code... — Sara Ree, May 24 '19 at 15:07

score 0 · Answer 1 · answered May 24 '19 at 14:59

0

You can set any CSS on any DOM element using the JavaScript style property.

document.getElementById("el").style.color = "blue"

I suppose there are valid reasons to do this, but you may want to ask if it's efficient to set all of your CSS in your script files.

answered May 24 '19 at 14:59

Chris B.

5,477
1
12
30

The problem is I can't understand ret.push(""); – Sara Ree May 24 '19 at 15:03
How can i style something that I don't know what exactly is? – Sara Ree May 24 '19 at 15:04
What do you mean you don't know exactly what it is? The HTML is hard coded into your page – ADyson May 24 '19 at 16:29

Adding css elements to javascript?

1 Answers1