Hacker News Reader

Comment by arp242 | Hacker News Reader

There are quite a few more examples of this:

    $('.class').remove()
    $('.class').after(...)

vs:

    var e = document.querySelector('.class')
    e.parentNode.removeChild(e)

    document.querySelector('.class').insertAdjacentElement('afterend', ...)

View on HN

This is good example of how browser APIs have gotten better:

// Edge 12 document.querySelector('.class').remove();

// Edge 17 document.querySelector('.class').after(...);

Where jQuery shines - but also hides a lot of complexity- is when operating on an array of elements, e.g. if you want to remove all elements with a certain class.

This kind of code grows explosively in a moderately-sized project, and the sheer volume and verbosity makes it hard to debug. Not to mention requiring more tylenol ;)

The modern DOM equivalent would look almost the same as the jQuery version:

  document.querySelector(".class").remove();
  document.querySelector(".class").after(...);

Reply on news.ycombinator.com