<div class="wrapper">
  <h3>Hello World</h3>
  <p>The class of <code>blue</code> is added when I am wider than 1280px and is removed when I am 1280px or less in width.</p>
</div>

body {
  font: normal 16px/1.5em sans-serif; 
  color: #111;
}

code {
  background: #ccc;
}

.wrapper {
  background: #fffccc;
  border: solid 3px rgba(0,0,0,0.1);
  margin: 20px;
  padding: 40px 20px;
}

.wrapper.blue {
  background: dodgerBlue;
}

.wrapper.green {
  background: green;
}

const wrapper = document.querySelector(".wrapper")
  var alterClass = function() {
    var ww = document.body.clientWidth;
    if (ww < 1280) {
      wrapper.classList.remove('blue');
    } else if (ww >= 1281) {
      wrapper.classList.add('blue');
    };
  };

window.addEventListener('resize', alterClass)
  //Fire it when the page first loads:
alterClass()