Filter elements on data-attribute instead of class in jQuery
<p>I am working on a simple method for filtering elements depending on their class. The user checks a checkbox and the jQuery does it's thing fine and turns off any element depending on the class. The line that turns off the element, and how the elements look is:</p>

<pre><code>$('#ItemList div:not(.' + Filter + ')').hide();
&lt;div class="1 2 3"&gt;asdf&lt;/div&gt;
</code></pre>

<p>However I want to be able to use the data-xxxx attribute to do this instead of the class attribute, but I am having problems actually selecting the elements this way. What I have is below:</p>

<pre><code>$("#ItemList div:not([data-filter'" + Filter + "'])").hide();
&lt;div data-filter="1 2 3"&gt;asdf&lt;/div&gt;
</code></pre>

<p>So, how do I go about selecting the element using the data-filter attribute instead of the class? The methods I have found on here are not working for me!
Many thanks.</p>

<p><strong>UPDATE</strong></p>

<p>Okay, so James Allardice's reply did the trick. But has caused another issue that I probably should I said in the original post.</p>

<p>Each data-xxxx attribute can have a number of values, I need this filter to work so that if any one of the value shows up it will not hide the element.</p>

<pre><code>$('#Filters input').change(function()
{
    $('#ItemList div').show();
    $('input').each(function()
    {
        var Checked;
        if(Checked = $(this).attr('checked'))
        {
            var Filter = $(this).attr('data-filter');
            $("#ItemList div:not([data-filter='" + Filter + "'])").hide();
        };
});

&lt;div data-filter="1"&gt;1&lt;/div&gt;
&lt;div data-filter="1 3"&gt;1 3&lt;/div&gt;
</code></pre>

<p>So for example if a checkbox with the following attribute is checked it will show both divs:</p>

<pre><code>data-filter="1"
</code></pre>

<p>But if the attribute is like this it will only show the second:</p>

<pre><code>data-filter="3"
</code></pre>
