jQuery to javascript quick notes

Set height to element on window resize

jQuery:

$('.class-name').click(function() {
  alert("onclick Event triggered!");;
})

javascript:

var p = document.getElementByClassName("class-name");
p.onclick = showAlert; // Add onclick function to element
    
function showAlert(event) {
 alert("onclick Event triggered!");
}

jQuery:

$(window).resize(function() {
  var height = $(window).height();
  $('.ar-parallax').css('height',height);
})

javascript:

window.addEventListener('resize', () => {
 var element = document.getElementsByClassName("ar-parallax");
 //element[0].classList.style.height;
 var wHeight = window.innerHeight;
 element[0].style.height = elHeight + 'px';
});

Add class to element

jQuery:

  $('body').addClass('fade-out');

javascript:

document.body.className += ' fade-out';

Recommended javascript:

$rightMenu[0].classList.toggle("open-menu"); //this will add the "open-menu" class ONLY IF it is not present

jQuery:

  $(window).load(function(){ //code here });

javascript:

//sample code will also add a class to the body tag
window.addEventListener('load', function () {
    document.body.classList.add('fade-away');
});

jQuery:

  if($('.class-a').hasClass('checked')) {
   //do something
  }

javascript:

//sample code will also add a class to the body tag
if (document.body.classList.contains('thatClass')) {
    // do some stuff
}

jQuery:

$('.class-a').addClass('checked'));
$('.class-a').removeClass('checked'));
$('.class-a').toggleClass('checked'));

javascript:

document.body.classList.add('thisClass');
// $('body').addClass('thisClass');

document.body.classList.remove('thatClass');
// $('body').removeClass('thatClass');

document.body.classList.toggle('anotherClass');
// $('body').toggleClass('anotherClass');

jQuery:

$( "#greatphoto" ).attr( "alt", "Beijing Brush Seller" );
$( "#greatphoto" ).removeAttr( "alt" );

javascript:

$photo = document.getElementsById("greatphoto");

$photo[0].setAttribute('alt', 'Beijing Brush Seller');
$photo[0].removeAttribute('alt');