Multiple conditions in if statement not working on Webflow

I am using collection lists on Webflow. I'd like to hide a parent div when 2 fields in the list are empty, so both conditions have to be true together. Webflow is sometimes tricky with Jquery so I tried a few different ways but no luck. What am I doing wrong?

Searching for empty collection items with the webflow class .w-dyn-bind-empty & adding a class with display:none if the statement is true:

$(document).ready(function() {
var width = $(window).width();
if (width < 992) {
        var con = $("#contractor"),
            photo = $("#photography");
        if (con.hasClass('.w-dyn-bind-empty') && photo.hasClass('.w-dyn-bind-empty')) {
                $("#collaborators").addClass('is--off');
        }
    }
});

Or checking for the empty values and using .hide:

$(document).ready(function() {
var width = $(window).width();
if (width < 992) {
        var con = $("#contractor").val(),
            photo = $("#photography").val();
        if (con == "" && photo == "") {
                $("#collaborators").hide();
        }
    }
});