Vanilla JS equivalents of jQuery methods

gistfile1.md

jQuery	Vanilla
```javascript $(document).ready(function() { }) ```	```javascript document.addEventListener('DOMContentLoaded', function() { }) ```
```javascript var divs = $('div') ```	```javascript var divs = document.querySelectorAll('div') ```
`var newDiv = $(' ')`	`var newDiv = document.createElement('div')`
`newDiv.addClass('foo')`	`newDiv.classList.add('foo')`
`newDiv.toggleClass('foo')	newDiv.classList.toggle('foo')
`$('a').click(function() { // code… })`	`[].forEach.call(document.querySelectorAll('a'), function(el) { el.addEventListener('click', function() { // code… }) })`
`$('body').append($(' '))	document.body.appendChild(document.createElement('p'))
`$('img').filter(':first').attr('alt', 'My image')	document.querySelector('img').setAttribute('alt', 'My image')
`var parent = $('#about').parent()`	`var parent = document.getElementById('about').parentNode`
`var clonedElement = $('#about').clone()`	var clonedElement = document.getElementById('about').cloneNode(true)
`$('#wrap').empty()`	`var wrap = document.getElementById('wrap') while(wrap.firstChild) wrap.removeChild(wrap.firstChild)`
`if($('#wrap').is(':empty'))`	`if(!document.getElementById('wrap').hasChildNodes())`
`var nextElement = $('#wrap').next()`	`var nextElement = document.getElementById('wrap').nextSibling`

Thanks for the great resource!

For the following:

// jQuery
$('#wrap').empty()

// Vanilla
var wrap = document.getElementById('wrap')
while(wrap.firstChild) wrap.removeChild(wrap.firstChild)

Why not wrap.innerHTML = '' or similar?
The while loop poses a problem if you are, e.g., ensuring that data refreshes probably -- since it will clear out anything you subsequently put into the element.