CODEWITHSUNDEEP
javascriptjqueryhtml
Peter
Peter

Reputation: 1128

Extract values from attribute selector

I'm new to jQuery selectors. How can I extract the values from an attribute?

Given:

<div class='container'>
<div class='entry' data-name='foo'></div>
<div class='entry' data-name='bar'></div>
<div class='entry' data-name='baz'></div>
</div>

I'd want to extract: ['foo','bar','baz']

Upvotes: 0

Views: 70

Answers (3)

xkeshav
xkeshav

Reputation: 54016

Try 

var name = [];
$('div.container').children().map(function() {  
    name.push($(this).data('name'));
});

Working DEMO

Upvotes: 1

Anik Islam Abhi
Anik Islam Abhi

Reputation: 25352

try this

$(function () {
    var array = [];
    $(".entry").each(function () {
        array.push($(this).data("name"));
    });
    console.log(array);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='container'>
<div class='entry' data-name='foo'></div>
<div class='entry' data-name='bar'></div>
<div class='entry' data-name='baz'></div>
</div>

Upvotes: 1

Arun P Johny
Arun P Johny

Reputation: 388316

You can use .map() to create an array from a set of dom elements like

var array = $('.container .entry').map(function () {
    return $(this).data('name')
}).get();

Upvotes: 2

Related Questions