How to optimize native JavaScript code when refactoring it from Jquery

I need to rewrite some Jquery into native JavaScript code but I am facing a problem that I am not so sure how to solve.

This is Jquery code I need to rewrite in native JS:

$('.class1').click(function () {
  setTimeout(() => {
    $('.class2').css('top', '252px');
    $('.class3').css('bottom', '0px');
  }, 200);
  $('.class2').css('z-index', '-1');
  $('.class1').css('z-index', '-1');
}); 

And this is what I have written in native JavaScrip:

if (document.querySelector('.class1')){
document.querySelector('.class1').addEventListener('click', function () {
    setTimeout(() => {
        if (document.querySelector('.class2')) {
            document.querySelector('.class2').style.top = '252px';
        }
        if ( document.querySelector('.class3')) {
            document.querySelector('.class3').style.bottom = '0px';
        }
    }, 200);
    if (document.querySelector('.class2')) {
        document.querySelector('.class2').style.zIndex = '-1';
    }
    if ( document.querySelector('.class1')) {
        document.querySelector('.class1').style.zIndex = '-1';
    }
})
}

I was hoping that people could explain to me how to solve two things:

1. Is there a more elegant way to check for an element on the current page if the code runs on the whole site?
   
2. Is there something else that I can replace those if statements inside the function?
   In Jquery those statements are executed one by one but in my case I need to check for an element first and if it is there do something with it.