ｊQueryでこう書くのを、vanillajsだとこう書くよってのをまとめてみました。
本当にメモなので解説的なのは特にないけどｗ

// jQUery
const $parent = $('.parent');
const $child = $parent.find('.child');

// JavaScript
const parent = document.querySelectorAll('.parent');
const child = parent.querySelectorAll('.child');

// jQUery
const $children = $parent.children();

// JavaScript
const children = parent.children;

// jQUery
const $hoges = $parent.children('.hoge');

// JavaScript
let hoges = [];
const allChildren = parent.children;
for (let i = 0; i < allChildren.length; i++) {
  const child = allChildren[i];
    if(child.classList.contains('hoge')){
      hoges.push(child);
    }
}

// jQuery
const $firstChild = $elem.children().first();
const $lastChild  = $elem.children().last();

// JavaScript
const firstChild = elem.firstElementChild;
const lastChild  = elem.lastElementChild;

// jQuery
const $parent = $elem.parent();

// JavaScript
const parent = elem.parentNode;

// jQuery
const $closestHoge = $elem.closest('.hoge');

// JavaScript
const closestHoge = elem.closest('.hoge');

// IEはだめらしい

const $next = $elem.next();
const $prev = $elem.prev();

const next = elem.nextElementSibling;
const prev = elem.previousElementSibling;

const $elem1 = $elems.eq(1);
const $elemM2 = $elems.eq(-2);

const elem1 = elems[1];
const elemM2 = elems[elems.length - 2];

const $notHoge = $elems.not('.hoge');
$notHoge.{なにかしらの処理};

for (let i = 0; i < elems.length; i++) {
  if (!elems[i].classList.contains('hoge')) {
        elems[i].{何かしらの処理};
  }
}

const $li = $('li');
$li.slice(2).{何かしらの処理}; //3つ目以降の全てのliに処理
$li.slice(2,5).{何かしらの処理}; //3つ目 ~ 5つ目のliに処理

const li = document.getElementsByTagName('li');
//3つ目以降の全てのliに処理
for (let i = 2; i < li.length; i++) {
    li[i].{何かしらの処理};
}

//3つ目 ~ 5つ目のliに処理
for (let i = 2; i < 5; i++) {
    li[i].{何かしらの処理};
}

// jQuery
$('.buttons').on('click', function(e){
    console.log($(e));
});

// JavaScript
const buttons = document.querySelector('.buttons');
buttons.addEventListener('click', (e) => {
  console.log(e.target);
});

class関連 classList

element.classList. {add/remove/contains/toggle}
vanilla でクラスを扱う方法

/* ############### addClass() ############### */
// jQuery
$('#example').addClass('className');
$('#example').addClass('className01 className02');

// JavaScript
const example = document.getElementById('example');
example.classList.add('className');
example.classList.add('className01, className-2');
example.className = 'className';

/* ############### removeClass() ############### */
// jQuery
$('#example').removeClass('className');
$('#example').removeClass('className01 className02');

// JavaScript
const example = document.getElementById('example');
example.classList.remove('className');
example.classList.remove('className01, className02');

/* ############### toggleClass() ################## */
// jQuery
$('#example').toggleClass('className');

// JavaScript
const example = document.getElementById('example');
example.classList.toggle('className');

/* ############### hasClass() ################## */
// jQuery

$('#example').hasClass('className');

// JavaScript
const example = document.getElementById('example');
example.classList.contains('className');

var selector = document.getElementById('select-id');

selector.addEventListener('change', function() {
  var index = this.selectedIndex;
  var value = this.options[index].value;
  console.log(value);
}, false);

// jQuery
const $elem1 = $elems.eq(1);
const $elemM2 = $elems.eq(-2);

// JavaScript
const elem1 = elems[1];
const elemM2 = elems[elems.length - 2];