Hide or remove a div class at mobile viewport?

Question

First and foremost, I am very aware of CSS media queries. My problem is this: When you have div classes stacked in one div; Example: ```

``` And you want to remove "class2" @media (max-width: 768px) Creating an output of: ```

``` ...once the 768px threshold has been reached. So far I have come up with nothing other than this non-functional code: ``` ``` I am really having a hard time finding an answer that works for this. I do not want to block the entire div's contents! Just remove one of two classes.

Accepted Answer

I'm not sure I get this, but are you just trying to toggle a class?

```
$(window).on('resize', function () {
    $('.class1').toggleClass('class2', $(window).width() < 768);
});
```

FIDDLE

jQuery has addClass(), removeClass() and toggleClass() methods readily available.

Note that `screen` is already defined in javascript.

Hide or remove a div class at mobile viewport?

Solution

Problem