Hola amigos, estoy tratando de agregar una clase al cuerpo dinámicamente dependiendo de la resolución de la ventana del navegador. Aquí está el código que estoy tratando de usar, pero necesito ayuda para ajustarlo, ya que no conozco jQuery en absoluto.

Las opciones que quiero lograr son:

Una vez que un visitante llega a mi sitio, este código debe verificar el tamaño de las ventanas de su navegador y agregar clase al cuerpo según las siguientes reglas

Si el tamaño de la ventana esmas que 1024pxpero menos de 1280px luego agregue clase.w1280.

Si el tamaño de la ventana esmas que 1280pxpero menos de 1440 px luego agrega clase.w1440.

Si el tamaño de la ventana esmas que 1440pxpero menos de 1280px luego agregue clase.w1680.

Si el tamaño de la ventana esmas que 1680px luego agregue clase.wLarge.

Para lograr esto, estoy tratando de usar el siguiente script. Mis preguntas son:

Es este elcódigo correcto? Si no, ¿cuál es el código correcto?

¿Es este el mejor?lo más corto posible ¿código? Si no, ¿cuál será el código correcto?

Ayuda amablemente ya que mi conocimiento de jQuery es casi CERO.

function checkWindowSize() {  
    if ( $(window).width() > 1024) { 
        $('body').addClass('w1280');  
        } else {  
        $('body').removeClass('w1280');  
    } 
    if ( $(window).width() > 1280 ) { 
        $('body').addClass('w1440');  
        } else {  
        $('body').removeClass('w1440');  
    } 
    if ( $(window).width() > 1440) { 
        $('body').addClass('w1680');  
        } else {  
        $('body').removeClass('w1680');  
    } 
    if ( $(window).width() > 1600) { 
        $('body').addClass('wLarge');  
        } else {  
        $('body').removeClass('wLarge');  
    } 
}    
checkWindowSize()