0

I am trying to change the background colors of all italized text, instead of using a span on every single word through the paragraph. It says <em> next to the italized text. I have tried

$(".em").css({
    "background-color":"#d9f9f9",
});

or/and tried this:

var elem=document.getElementByTagName(em)[1];
elem.style.backgroundColor='#d9f9f9';
Santosh
  • 3,477
  • 5
  • 37
  • 75
Spencer Halstead
  • 33
  • 2

3 Answers3

1

See querySelectorAll:

Notices this method return an array, so we should loop it:

var emList = document.querySelectorAll('em');

[].forEach.call(emList , function(em) {
  // do whatever
  em.style.color = "red";
});
navylover
  • 12,383
  • 5
  • 28
  • 41
0

Your first suggestion says ".em" where it should say "em". Your seconds suggestion says em where it should say "em".

Mark Roberts
  • 138
  • 7
0

You could try the following:

const italics = document.querySelectorAll('em');

italics.forEach(italic => {
  italic.style.backgroundColor = '#d9f9f9';
});
Egil Hansen
  • 158
  • 2
  • 8
  • The second option from Egil worked in the text editor. Don't know why it will not work in wordpress custom css and js plugin. – Spencer Halstead Feb 23 '22 at 22:37
  • I'm not very familiar with Wordpress, but typically you get problems if the code is run before the DOM is ready. Check out this post for wrapping the code in a window.onload: https://stackoverflow.com/questions/68552671/how-can-i-execute-script-after-wordpress-page-contents-fully-loaded – Egil Hansen Feb 25 '22 at 07:43