Best way to build checkbox filter to show/hide elements based on multiple data-* attributes

I'm trying to build a checkbox filter that will show/hide elements based on multiple data-* attributes on those elements. I've made a couple attempts which aren't quite working out to the filtering I want.

I've made a bare bones fiddle at:

http://ift.tt/1VCRLFX

$('input[type="checkbox"]').click(function() {
    var $checked = $('input[type="checkbox"]:checked');
    var $productItem = $('.productItem');

    if ($checked.length > 0) {
        $productItem.hide();

        $checked.each(function() {
            $('.productItem[data-level=' + this.value + ']').show();
            $('.productItem[data-price=' + this.value + ']').show();
            $('.productItem[data-network=' + this.value + ']').show();
        });
    } else {
        $productItem.show();
    }
});

I know this code is not correct, it's just where I hit the same wall starting over from scratch in a fiddle.

The filtering I'm after is an "and" filter where the more filters you apply, the less results you typically end up with.

For example, in the fiddle, if you select "gold" you just get gold results. If you add the "silver" filter you get gold and silver, which is good so far. So I'm and'ing fine within one data-* attribute.

The problem is if you add another data-* filter, for example, with gold and silver selected, add the "network A" filter. In this case, I want the results to be filtered down to only gold and only silver elements with only gold/silver elements that also have the network A data attribute.

What's the best way to build this sort of filtering so when the price filter is applied it filters results down even more?