How to trigger media Queries in javascript for style.width

Question

I'm working on a onclick event (html) with jquery. In my jquery i set the width for this event.

Though i want a different width for the mobile website. For this I should work with media queries. On desktop it is 50vw, on phone (triggered from 600px) it should be 100vw... Though how to make this work properly?

function openMenu() {
document.getElementById("menuNav").style.width = "50vw"; 
}

function closeMenu() {
    document.getElementById("menuNav").style.width = "0vh";
}

Answer 1

if($(window).width() < 601) { 
    // change functionality for smaller screens
} else { 
    // change functionality for larger screens
}e

or

if(window.matchMedia('(max-width: 600px)').matches)
{
    // do functionality on screens smaller than 600px
}