Enquire match & unmatch

by WickyNilliams

HTML

<script src="https://raw.github.com/WickyNilliams/enquire.js/master/dist/enquire.js"></script>
<div class="target">
    <button>Click</button>
</div>

CSS

.matched {
    background-color: red;
}

JavaScript

$(document).ready(function() {

    var $target = $(".target"),
        $btn = $target.children("button");

    enquire.register("screen and (max-width:500px)", {
        match: function() {
            $target.addClass("matched");
            $btn.on("click", function() {
                alert("matched and clicked!");
            });
        },

        unmatch: function() {
            $target.removeClass("matched");
            $btn.off("click");
        }
    }).listen();
});