given a long list, how can i select x elements randomly?

Question

Markup:

<ul>
<li>Bla</li>
<li>Ble</li>

...


<li>zla</li>
</ul>

Lets asume its a really long list, how can i select x items, but randomlly?

-edit-

Not exact duplicate, i am trying to select x items;

something like:
var i = 0;
$("li:random").each(function(){
    i++; if(i==50) break;
})

possible duplicate of [jQuery: select random elements](http://stackoverflow.com/questions/1764160/jquery-select-random-elements) — Esailija, Jun 14 '12 at 18:24
I don't understand how this question is getting downvotes with so many answers.. — Toni Michel Caubet, Jun 14 '12 at 18:48

Sergey Rybalkin · Accepted Answer · 2012-06-14T18:50:40.957

3

Here is a quick example of how to get this using javascript random function:

$(function() {
    var randomItemsNum = 3;
    var totalItems = $('#mylist > li').length;

    for (var index = 0; index < randomItemsNum; index++) {
        var randomIndex = Math.floor((Math.random() * totalItems) + 1);
        var item = $('#mylist > li:nth-child(' + randomIndex + ')');
        if (item.hasClass('selected')) {
            index--;
            continue;
        }
        else {
            item.addClass('selected');
        }
    }
});

It adds CSS class selected to 3 random list items. Check working demo here - http://jsfiddle.net/Pharaon/PPW9J/1/

edited Jun 14 '12 at 18:50

answered Jun 14 '12 at 18:28

Sergey Rybalkin

3,004
22
26

3

And what if the same element is selected twice? – Niet the Dark Absol Jun 14 '12 at 18:42
You are right, I've updated the fiddle to fix this - http://jsfiddle.net/Pharaon/PPW9J/1/ – Sergey Rybalkin Jun 14 '12 at 18:49
@ToniMichelCaubet my answer avoids duplicates – lbstr Jun 15 '12 at 15:04

lbstr · Answer 2 · 2012-06-15T15:13:09.203

function selectRandomFromList($list, num){
    var $children = $list.children(),
        len = $children.length,
        a = [],
        o = {},
        r,
        $items = $([]);

    if (!len) { return $items; }
    if (num >= len) { return $children; }

    // Build an array of unique indices
    while (a.length < num) {
        r = Math.floor(Math.random() * len);
        if (!o.hasOwnProperty(r)) {
            o[r] = 1;
            a.push(r);
        }
    }

    // grab the items
    while (num--) {
        $items = $items.add($children.eq(a.pop()));
    }

    return $items;
}

Example usage:

selectRandomFromList($('ul'), 3);

Demo:

http://jsfiddle.net/lbstr/d8JgP/

I see that it checks if there are less items? thats awesome – Toni Michel Caubet Jun 14 '12 at 18:42 — Toni Michel Caubet, Jun 14 '12 at 18:42

score 0 · Answer 3 · answered Jun 14 '12 at 18:24

0

Choose a random number (r) between 1 and the length of the list.
Pick all elements where el# % r == 0.

Done. :)

answered Jun 14 '12 at 18:24

Esteban Araya

29,284
24
107
141

How does this select a given number of items? It seems to select a random number of items instead. – apsillers Jun 14 '12 at 18:28
@apsillers thanks!, yes please Esteban, can you elaborate a bit? – Toni Michel Caubet Jun 14 '12 at 18:29

score 0 · Answer 4 · answered Jun 14 '12 at 18:25

0

I think you could get away with doing something like this:


var list_length = $("ul li").length;
var x; //Assign amount of items
for(var i = 0; i <= x; i++) {
   Math.floor((Math.random()*list_length));
   //Select stuff in here
}

answered Jun 14 '12 at 18:25

ayyp

6,590
4
33
47

@ToniMichelCaubet It get's the amount of list items, and for however many things you want randomly selected, will generate a random number from 0 to the maximum amount of list items. – ayyp Jun 14 '12 at 18:29
but how do i select there? $('ul li')[i] ? – Toni Michel Caubet Jun 14 '12 at 18:30
1

@ToniMichelCaubet You could do `$("li").eq(i)` to select the element. – ayyp Jun 14 '12 at 18:33

score 0 · Answer 5 · edited May 23 '17 at 11:55

0

Do this way:-

randomList = 8;

randomElements = jQuery("li").get().sort(function(){ 
  return Math.round(Math.random())-0.5
}).slice(0,randomList);

$(randomElements).addClass("activeLI");

CSS

.activeLI {
    color: red;
}

Change randomList number 8 to 50 or any number.

Refer to the LIVE DEMO

copied from jQuery: select random elements this answer.

edited May 23 '17 at 11:55

Community

1
1

answered Jun 14 '12 at 18:26

Siva Charan

17,940
9
60
95

given a long list, how can i select x elements randomly?

5 Answers5

CSS