Cara menghapus class div jika hanya dalam tampilan mobile

Cssnya buatan sendiri atau menggunakan framework gan (bootstrap atau materialize)? Kalau menggunakan css sendiri mungkin simplenya bisa styling di media querienya langsung. Kalau pakai bootstrap atau lainnya, biar nanti tidak compleceted bisa dimainin melalui jquery. Yang saya paham agan ini maunya begini, saat device widthnya di atas 500px maka codenya seperti di atas, kalau di bawah 500px maunya gini?

// class navbar-fixed dihapus jadi tersisa div saja
<div>
  <nav>
     // kode lain2nya
  </nav>
</div>

Kalau seperti itu, bisa tes melalui jquery dan sedikit tambahan id di divnya:

// tambahkan id yg akan kita jadikan selector di jquery
<div id="mynavbar">
  <nav>
     // kode lain2nya
  </nav>
</div>

<script>
// Kita lakukan binding pada window, saat DOM content di load, halaman di load, ataupun diresize maka kita lakukan
$(window).bind('DOMContentLoaded load resize', function() {
   // pengecekan ukuran width window, bila widthnya lebih kecil atau sama dengan 500
   if($(window).innerWidth() <= 500) {
      // Kita remove class navbar-fixed
      $('#mynavbar').removeClass('navbar-fixed');
   }else{
      // diluar dari kondisi diatas kita akan add class navbar-fixed
      $('#mynavbar').addClass('navbar-fixed');
   }
});
</script>