0

I'm trying to translate this jQuery into JavaScript, to save a bit on load time. Here's the line of jQuery:

$('div.annotated p > span.citation').parent().css('display', 'inline')

And here's what I have so far in JavaScript:

document.querySelectorAll('div.annotated p > span.citation').forEach((el) => {})

I'm stuck on how to find the parent of an element, and also apparently how to set the CSS for that element. Should I stick with jQuery, or can JavaScript also do this, and is it much harder?

Jonathan
  • 10,571
  • 13
  • 67
  • 103
  • 2
    Never been a fan of `parent` myself. I prefer `closest(selector)` as it's flexible if your structure changes. Either way, the docs are where you should be looking: https://developer.mozilla.org/en-US/docs – Kinglish Dec 05 '22 at 00:17
  • Try this `document.querySelectorAll('div.annotated p > span.citation').forEach((el) => {el.parentElement.style.display = 'inline'})` – ruleboy21 Dec 05 '22 at 00:24
  • jQuery already is JavaScript. You’re trying to translate this code into the native DOM API, or more specifically, the ECMAScript binding of the W3C (WHATWG) DOM API. – Sebastian Simon Dec 05 '22 at 03:54

0 Answers0