Случайным образом отображает класс div, используя JQuery

Я хочу случайным образом отобразить div-класс с помощью JQuery. Код выглядит примерно так:

<div class="item">One</div>
<div class="item">Two</div>
<div class="item">Three</div>
<div class="item">Four</div>

Итак, если случайный метод (случайный результат находится в пределах от 1 до 4) дает 3 в результате, он показывает:

<div class="item">Three</div>

Остальные скрыты. Конечно, код можно изменить, чтобы он работал. Спасибо.

Ответ 1

Сначала мы получаем случайный int, от нуля до количества элементов (минус 1). Затем мы спрячем все остальные элементы и покажем только случайный выбор.

var random = Math.floor(Math.random() * jQuery('.item').length);
jQuery('.item').hide().eq(random).show();

Демо

Ответ 2

var number = Math.floor(Math.random()*3)
var div = $(".item")[number];
div.show();

Ответ 3

Что-то вроде этого:

$('.item').hide().eq(Math.floor(Math.random()*4)).show()

Fiddle: http://jsfiddle.net/PPXmE/

Ответ 4

Рабочий пример: jsFiddle

JS

window.onload=function() {
  var E = document.getElementsByClassName("item");
  var m = E.length;
  var n = parseInt(Math.random()*m);
  for (var i=m-1;i>=0;i--) {
      var e = E[i];
      e.style.display='none';
  }
  E[n].style.display='';
}

js.minified

window.onload=function(){var E=document.getElementsByClassName("item");var m=E.length;var n=parseInt(Math.random()*m);for(var i=m-1;i>=0;i--){var e=E[i];e.style.display='none';}E[n].style.display='';}

HTML

<div class="item">One</div>
<div class="item">Two</div>
<div class="item">Three</div>
<div class="item">Four</div>
<div class="item">Five</div>
<div class="item">Six</div>
<!-- Add as many as you want! //-->