Searching HTML5 data attributes using wildcards in JQuery

Question

I have the following list of elements that uses the HTML 5 data attributes.

<div data-element="INFO-NAME"></div>
<div data-element="INFO-EMAIL"></div>
<div data-element="INFO-ADDRESS"></div>
<div data-element="INFO-ZIP"></div>

What I would like to do is to get the list of all the elements that contains

data-element="INFO-*"

I tried $('[data-element="INFO-*"]') but this returns an empty object. How can I retrieve this list?

Answer 1

You can use

 $('[data-element^="INFO-"]')

which means find any element with attribute data-element with a value starting with INFO-

See more at http://www.w3.org/TR/selectors/#attribute-substrings

Answer 2

Use ^=, which means the «starting from»:

$('[data-element^="INFO-"]')