Question

I have a list like so

<ul id="a">
<li data-id="i1" data-pk-type="foo bar">sdfsf</li>
<li data-id="i2" data-pk-type="foo">sdfs</li>
<li data-id="i3" data-pk-type="bar baz">sfdsf</li>
<li data-id="i4" data-pk-type="qux foo">sfds</li>
<li data-id="i5" data-pk-type="baz">sdff</li>
</ul>

I want to find all the elements that contain a given data-pk-type. I am trying the following unsuccessful code because .data("pkType", "foo") actually sets the data attribute to foo;

var $links = $("#a").find("li").data("pkType", "foo");

I could do something like

var $links = $("#a").find("li", "[data-pk-type='foo']");

however that wouldn’t work as well… I want any element that might contain foo. Suggestions?

Answer 1

Description

You should use jQuerys Attribute Contains Selector [name*="value"].

Attribute Contains Selector [name*=”value”]: Selects elements that have the specified attribute with a value containing the a given substring

Check out the sample and jSFiddle Demonstration

Sample

$links = $("li[data-pk-type*='foo']");
alert($links.length);

will give you a 3, so 3 elements was found.

More Information

• Attribute Contains Selector [name*=”value”]
• jSFiddle Demonstration