JS resize function for mobile and tablet

window-resize.js

$(window).resize(function() {
         //var viewportWidth = $(window).width(); jQuery selector has inconsistencies with Media Queries
         var viewportWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; // JS better consistency with Media Queries
          /*Mobile view*/
          if (( viewportWidth <= 600 ) || ( viewportWidth > 776 ) && (viewportWidth < 921)) {
             //Setup Markup to add attribute requirements for mobile
             console.log( "on mobile" );
          }
          /*Descktop view */
          else {
             console.log( "NOT on mobile" );
              
          }
      });
      $(window).trigger('resize');

After doing a bit of testing/googling turned out that using JS to define the viewport was more consistent than jQuery. After a bit more trial and error it appears that using jQuery like so:
var viewportWidth = $(window).outerWidth(true);
is just as good as defining the viewportWidth var with JS