Get highest id using javascript

Question

I have a bunch of note divs in the following format:

<div class="note-row" id="1">
<div class="note-row" id="2">
<div class="note-row" id="4">
<div class="note-row" id="5">
<div class="note-row" id="6">

How would I get the largest id using javascript? So far I have:

$('.note-row').each(function() {
    ??
});

If the elements are arranged in order by ID and only these elements has class `note-row` then you can do it using `.last`. -> `$('.note-row').last()[0].id` — Selvakumar Arumugam, Mar 12 '13 at 20:15

score 17 · Accepted Answer · edited Mar 12 '13 at 20:31

17

Quick and dirty way:

var max = 0;
$('.note-row').each(function() {
    max = Math.max(this.id, max);
});
console.log(max);

This is a little shorter and more sophisticated (for using reduce, and also allowing negative ids down to Number.NEGATIVE_INFINITY, as suggested by Blazemonger):

var max = $('.note-row').get().reduce(function(a, b){
    return Math.max(a, b.id)
}, Number.NEGATIVE_INFINITY);

edited Mar 12 '13 at 20:31

Blazemonger

90,923
26
142
180

answered Mar 12 '13 at 20:10

bfavaretto

71,580
16
111
150

+1, much more efficient than the other answer which uses `map` and `sort`. – Dogbert Mar 12 '13 at 20:12
2

`max = Math.max(this.id,max)` beats an if-then statement any day. – Blazemonger Mar 12 '13 at 20:13
@Blazemonger Thanks. I was wondering if I needed to add parseInt too, and Math.max should take care of that too. Updated. – bfavaretto Mar 12 '13 at 20:16
2

Gonna push for an initial value of `max = Number.NEGATIVE_INFINITY` here as well. :-) – Blazemonger Mar 12 '13 at 20:17
@Blazemonger Nice, used that in an alternate solution based on [].reduce. – bfavaretto Mar 12 '13 at 20:24
Your second version seems more complicated and inefficient than your first version. – Selvakumar Arumugam Mar 12 '13 at 20:26
@Vega That's sort of what I meant with "sophisticated". But why inneficient? Because of the `.toArray call`? It can be avoided with `Array.prototype.reduce.call($('.note-row'), ...`, but that would make it look even more complicated. – bfavaretto Mar 12 '13 at 20:29
1

Replaced `toArray` with `get` because, well, it's shorter. ;-) – Blazemonger Mar 12 '13 at 20:32
Caveat: [`reduce` may require a polyfill in older browsers](https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Array/Reduce#Compatibility). – Blazemonger Mar 13 '13 at 13:26
@Blazemonger I just ran some performance tests you might be interested in: http://jsperf.com/stack-overflow-question-15371102. – bfavaretto Mar 13 '13 at 14:35

Blender · Answer 2 · 2013-03-12T20:16:37.370

8

You could do something like this:

var ids = $('.note-row').map(function() {
    return parseInt(this.id, 10);
}).get();

var max = Math.max.apply(Math, ids);

edited Mar 12 '13 at 20:16

answered Mar 12 '13 at 20:10

Blender

289,723
53
439
496

Except this doesn't actually get the highest for me. The highest in the set I have is 20, whereas this gives me 9. – David542 Mar 12 '13 at 20:12
2

Other than being inefficient, this will not work as `.sort` in JS doesn't work with numbers as you'd expect. – Dogbert Mar 12 '13 at 20:14
@Dogbert: If you're going for efficiency, don't use jQuery in the first place. – Blender Mar 12 '13 at 20:26

score 2 · Answer 3 · answered Mar 12 '13 at 20:19

2

Funny but this also works:

var max = $('.note-row').sort(function(a, b) { return +a.id < +b.id })[0].id;

http://jsfiddle.net/N5zWe/

answered Mar 12 '13 at 20:19

dfsq

191,768
25
236
258

Ideally sort comparator functions are supposed to return -1 ot 0 or 1. – Selvakumar Arumugam Mar 12 '13 at 20:21
@Vega I know, but in this case it's not necessary since we are looking for the max value. Anyway I provided this solution just for the sake of curiosity. Of course it sucks. – dfsq Mar 12 '13 at 20:22

Blazemonger · Answer 4 · 2013-03-13T14:44:49.550

2

In the interest of completeness, an optimized Vanilla JS solution:

var n = document.getElementsByClassName('note-row'),
    m = Number.NEGATIVE_INFINITY,
    i = 0,
    j = n.length;
for (;i<j;i++) {
    m = Math.max(n[i].id,m);
}
console.log(m);

edited Mar 13 '13 at 14:44

answered Mar 12 '13 at 20:44

Blazemonger

90,923
26
142
180

[This is the fastest technique](http://jsperf.com/stack-overflow-question-15371102/2), if not necessarily the shortest code. – Blazemonger Mar 13 '13 at 14:45

score 0 · Answer 5 · answered Mar 12 '13 at 20:11

0

The same way you'd find any max, loop:

var max = -999; // some really low sentinel

$('.note-row').each(function() {
    var idAsNumber = parseInt(this.id, 10);
    if (idAsNumber  > max) {
        max = idAsNumber;
    }
});

answered Mar 12 '13 at 20:11

jbabey

45,965
12
71
94

`max = Number.NEGATIVE_INFINITY` is the initial value you were looking for. – Blazemonger Mar 12 '13 at 20:15

score 0 · Answer 6 · answered Mar 12 '13 at 20:12

0

  var maxID = -1;
  $('.note-row').each(function() {
       var myid = parseInt($(this).attr('id'),10);
       if( maxID < myid ) maxID = myid;
  });
  // the value of maxID will be the max from id-s

answered Mar 12 '13 at 20:12

Kovge

2,019
1
14
13

Get highest id using javascript

6 Answers6

Linked