Ufdjrw

Is it ok to trim down a tube patch?

Can you teleport closer to a creature you are Frightened of?

Help understanding this unsettling image of Titan, Epimetheus, and Saturn's rings?

Can I board the first leg of the flight without having final country's visa?

Reference request: Grassmannian and Plucker coordinates in type B, C, D

Is there a reasonable and studied concept of reduction between regular languages?

Traveling with my 5 year old daughter (as the father) without the mother from Germany to Mexico

Is French Guiana a (hard) EU border?

Lucky Feat: How can "more than one creature spend a luck point to influence the outcome of a roll"?

Is it ever safe to open a suspicious HTML file (e.g. email attachment)?

How to avoid supervisors with prejudiced views?

free fall ellipse or parabola?

It is correct to match light sources with the same color temperature?

What happened in Rome, when the western empire "fell"?

Aggressive Under-Indexing and no data for missing index

Why am I getting "Static method cannot be referenced from a non static context: String String.valueOf(Object)"?

Does the Idaho Potato Commission associate potato skins with healthy eating?

Easy to read palindrome checker

Small nick on power cord from an electric alarm clock, and copper wiring exposed but intact

If Nick Fury and Coulson already knew about aliens (Kree and Skrull) why did they wait until Thor's appearance to start making weapons?

Is it correct to say moon starry nights?

How to Implement Deterministic Encryption Safely in .NET

TikZ: How to fill area with a special pattern?

What is the process for purifying your home if you believe it may have been previously used for pagan worship?

Get an array of id with the selector being a class [duplicate]

-1

This question already has an answer here:

• 
  How to get all of the IDs with jQuery?
  
  9 answers
  
  

I have one modal with several checkbox. These checkboxes receive a class when checked (marked).

I need to get all id that have a marked class. How do I do that?

I tried the code below, but I did not succeed:

var test = $('.marked');
var array[];

for(var i = 0; i<test.length; i++)
 array[i] = $('.marked').attr('id');

javascript jquery

share|improve this question

edited Mar 7 at 18:59

Andrew Marques

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

marked as duplicate by FrankerZ, freedomn-m, SherylHohman, TheIncorrigible1, Juan Castillo Mar 7 at 19:35

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I found the examples mentioned here better when dealing with classes as selectors and getting ids in an array. The explanations of the comments from this post made more sense to this checkbox situation.
  
  – Andrew Marques
  Mar 7 at 18:56
  
  

  
  
  
  

add a comment | 

-1

This question already has an answer here:

• 
  How to get all of the IDs with jQuery?
  
  9 answers
  
  

I have one modal with several checkbox. These checkboxes receive a class when checked (marked).

I need to get all id that have a marked class. How do I do that?

I tried the code below, but I did not succeed:

var test = $('.marked');
var array[];

for(var i = 0; i<test.length; i++)
 array[i] = $('.marked').attr('id');

javascript jquery

share|improve this question

edited Mar 7 at 18:59

Andrew Marques

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

marked as duplicate by FrankerZ, freedomn-m, SherylHohman, TheIncorrigible1, Juan Castillo Mar 7 at 19:35

This question has been asked before and already has an answer. If those answers do not fully address your question, please ask a new question.

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I found the examples mentioned here better when dealing with classes as selectors and getting ids in an array. The explanations of the comments from this post made more sense to this checkbox situation.
  
  – Andrew Marques
  Mar 7 at 18:56
  
  

  
  
  
  

add a comment | 

This question already has an answer here:

• 
  How to get all of the IDs with jQuery?
  
  9 answers
  
  

I have one modal with several checkbox. These checkboxes receive a class when checked (marked).

I need to get all id that have a marked class. How do I do that?

I tried the code below, but I did not succeed:

var test = $('.marked');
var array[];

for(var i = 0; i<test.length; i++)
 array[i] = $('.marked').attr('id');

javascript jquery

share|improve this question

edited Mar 7 at 18:59

Andrew Marques

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

var test = $('.marked');
var array[];

for(var i = 0; i<test.length; i++)
 array[i] = $('.marked').attr('id');

share|improve this question

edited Mar 7 at 18:59

Andrew Marques

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

share|improve this question

edited Mar 7 at 18:59

Andrew Marques

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

asked Mar 7 at 18:32

Andrew MarquesAndrew Marques

96

5 Answers
5

active

oldest

votes

1

You can use .each() to iterate and add them to your array:

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

Even easier yet, you can just use the internal .map() function, and use .get() to convert it to a nice array:

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

share|improve this answer

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I got it that way and I found the last tip better. Thank you!
  
  – Andrew Marques
  Mar 7 at 18:54
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I using this way, will I have problems with other browsers? Is it compatible with all? Where can I get this information?
  
  – Andrew Marques
  Mar 7 at 19:07
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AndrewMarques You can find browser compatibility tables for methods on MDN - developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
  
  – Tom O.
  Mar 7 at 20:09
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  How can I mount an array with properties and for each array property use .map? I tried this way but I could not: var array = [ 'key': $('.checked').map((idx, el) => $(el).parent().find('span').attr('class').replace('nome_grupo_comercial_').text()).get(), 'value': $('.checked').map((idx, el) => $(el).parent().find('span').text()).get() ];
  
  – Andrew Marques
  Mar 8 at 19:44
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Array's don't have keys; they only have values. Maybe you're thinking of an object: key: value @AndrewMarques?
  
  – FrankerZ
  Mar 8 at 19:46
  
  

  
  
  
  

 | 
show 3 more comments

0

var test = $('.marked');
console.log( test.map((index, element) => element.id).get() );

Use map() to get all the ids, and then use get() to turn it into a simple array.

share|improve this answer

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I understood that and I thought it was better. Thank you!
  
  – Andrew Marques
  Mar 7 at 19:01
  
  

  
  
  
  

add a comment | 

0

You can use .map():

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

share|improve this answer

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I understood that and I thought it was better. Thank you!
  
  – Andrew Marques
  Mar 7 at 19:02
  

  
  
  
  

add a comment | 

0

If you want to use plain javascript:

var elements = document.getElementsByClassName("marked");
var arr = [];
for(el of elements) 
 if(el.id) //make sure the element has an id
 arr.push(el.id);
 

You could also use Array.map with a little trickery:

var elements = document.getElementsByClassName("marked");
var arr = Array.prototype.map.call(elements, function(el)
 if(el.id) return el.id;
);

share|improve this answer

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

add a comment | 

0

You can use a css selector and wrap it in Array.from to cast it from a NodeList to an actual array. Then you can call map on that array to create a new array containing the element id for each:

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

share|improve this answer

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428

add a comment | 

1

You can use .each() to iterate and add them to your array:

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

Even easier yet, you can just use the internal .map() function, and use .get() to convert it to a nice array:

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

share|improve this answer

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I got it that way and I found the last tip better. Thank you!
  
  – Andrew Marques
  Mar 7 at 18:54
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I using this way, will I have problems with other browsers? Is it compatible with all? Where can I get this information?
  
  – Andrew Marques
  Mar 7 at 19:07
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AndrewMarques You can find browser compatibility tables for methods on MDN - developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
  
  – Tom O.
  Mar 7 at 20:09
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  How can I mount an array with properties and for each array property use .map? I tried this way but I could not: var array = [ 'key': $('.checked').map((idx, el) => $(el).parent().find('span').attr('class').replace('nome_grupo_comercial_').text()).get(), 'value': $('.checked').map((idx, el) => $(el).parent().find('span').text()).get() ];
  
  – Andrew Marques
  Mar 8 at 19:44
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Array's don't have keys; they only have values. Maybe you're thinking of an object: key: value @AndrewMarques?
  
  – FrankerZ
  Mar 8 at 19:46
  
  

  
  
  
  

 | 
show 3 more comments

1

You can use .each() to iterate and add them to your array:

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

Even easier yet, you can just use the internal .map() function, and use .get() to convert it to a nice array:

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

share|improve this answer

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I got it that way and I found the last tip better. Thank you!
  
  – Andrew Marques
  Mar 7 at 18:54
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I using this way, will I have problems with other browsers? Is it compatible with all? Where can I get this information?
  
  – Andrew Marques
  Mar 7 at 19:07
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  @AndrewMarques You can find browser compatibility tables for methods on MDN - developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/…
  
  – Tom O.
  Mar 7 at 20:09
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  How can I mount an array with properties and for each array property use .map? I tried this way but I could not: var array = [ 'key': $('.checked').map((idx, el) => $(el).parent().find('span').attr('class').replace('nome_grupo_comercial_').text()).get(), 'value': $('.checked').map((idx, el) => $(el).parent().find('span').text()).get() ];
  
  – Andrew Marques
  Mar 8 at 19:44
  
  

  
  
  
  


• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  Array's don't have keys; they only have values. Maybe you're thinking of an object: key: value @AndrewMarques?
  
  – FrankerZ
  Mar 8 at 19:46
  
  

  
  
  
  

 | 
show 3 more comments

You can use .each() to iterate and add them to your array:

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

Even easier yet, you can just use the internal .map() function, and use .get() to convert it to a nice array:

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

share|improve this answer

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

var test = $('.marked');
var arr = [];

$(test).each((idx, el) => arr.push($(el).attr('id')));

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

var arr = $('.marked').map((idx, el) => $(el).attr('id')).get();

console.log(arr);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>

share|improve this answer

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

answered Mar 7 at 18:35

FrankerZFrankerZ

17.9k73067

0

var test = $('.marked');
console.log( test.map((index, element) => element.id).get() );

Use map() to get all the ids, and then use get() to turn it into a simple array.

share|improve this answer

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I understood that and I thought it was better. Thank you!
  
  – Andrew Marques
  Mar 7 at 19:01
  
  

  
  
  
  

add a comment | 

0

var test = $('.marked');
console.log( test.map((index, element) => element.id).get() );

Use map() to get all the ids, and then use get() to turn it into a simple array.

share|improve this answer

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I understood that and I thought it was better. Thank you!
  
  – Andrew Marques
  Mar 7 at 19:01
  
  

  
  
  
  

add a comment | 

var test = $('.marked');
console.log( test.map((index, element) => element.id).get() );

Use map() to get all the ids, and then use get() to turn it into a simple array.

share|improve this answer

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

var test = $('.marked');
console.log( test.map((index, element) => element.id).get() );

share|improve this answer

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

answered Mar 7 at 18:36

TaplarTaplar

17.9k21529

0

You can use .map():

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

share|improve this answer

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I understood that and I thought it was better. Thank you!
  
  – Andrew Marques
  Mar 7 at 19:02
  

  
  
  
  

add a comment | 

0

You can use .map():

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

share|improve this answer

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

• 
  
  
  

  
  

  
  
  
  
  
  

  
  
  I understood that and I thought it was better. Thank you!
  
  – Andrew Marques
  Mar 7 at 19:02
  

  
  
  
  

add a comment | 

You can use .map():

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

share|improve this answer

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

var ids = $(".marked").map(function() 
 return this.id;
).get();
console.log(ids.join(","))

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type='checkbox' checked class='marked' id='m1' />
<input type='checkbox' checked class='marked' id='m2' />
<input type='checkbox' id='m3' />
<input type='checkbox' id='m4' />
<input type='checkbox' checked class='marked' id='m5' />

share|improve this answer

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

answered Mar 7 at 18:37

freedomn-mfreedomn-m

13.3k32148

0

If you want to use plain javascript:

var elements = document.getElementsByClassName("marked");
var arr = [];
for(el of elements) 
 if(el.id) //make sure the element has an id
 arr.push(el.id);
 

You could also use Array.map with a little trickery:

var elements = document.getElementsByClassName("marked");
var arr = Array.prototype.map.call(elements, function(el)
 if(el.id) return el.id;
);

share|improve this answer

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

add a comment | 

0

If you want to use plain javascript:

var elements = document.getElementsByClassName("marked");
var arr = [];
for(el of elements) 
 if(el.id) //make sure the element has an id
 arr.push(el.id);
 

You could also use Array.map with a little trickery:

var elements = document.getElementsByClassName("marked");
var arr = Array.prototype.map.call(elements, function(el)
 if(el.id) return el.id;
);

share|improve this answer

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

add a comment | 

If you want to use plain javascript:

var elements = document.getElementsByClassName("marked");
var arr = [];
for(el of elements) 
 if(el.id) //make sure the element has an id
 arr.push(el.id);
 

You could also use Array.map with a little trickery:

var elements = document.getElementsByClassName("marked");
var arr = Array.prototype.map.call(elements, function(el)
 if(el.id) return el.id;
);

share|improve this answer

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

var elements = document.getElementsByClassName("marked");
var arr = [];
for(el of elements) 
 if(el.id) //make sure the element has an id
 arr.push(el.id);
 

var elements = document.getElementsByClassName("marked");
var arr = Array.prototype.map.call(elements, function(el)
 if(el.id) return el.id;
);

share|improve this answer

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

answered Mar 7 at 18:44

MarcoMarco

13.2k44780

0

You can use a css selector and wrap it in Array.from to cast it from a NodeList to an actual array. Then you can call map on that array to create a new array containing the element id for each:

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

share|improve this answer

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428

add a comment | 

0

You can use a css selector and wrap it in Array.from to cast it from a NodeList to an actual array. Then you can call map on that array to create a new array containing the element id for each:

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

share|improve this answer

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428

add a comment | 

You can use a css selector and wrap it in Array.from to cast it from a NodeList to an actual array. Then you can call map on that array to create a new array containing the element id for each:

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

share|improve this answer

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

var markedElementIds = Array.from(document.querySelectorAll("div[class='marked']")).map(el => el.id)
console.log(markedElementIds);

<div class="marked" id="1"></div>
<div class="marked" id="2"></div>
<div class="notmarked" id="3"></div>
<div class="marked" id="4"></div>

share|improve this answer

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428

answered Mar 7 at 18:50

Tom O.Tom O.

2,64121428