画面いっぱいに要素を増やして、それをランダムで(全部)非表示にする

前回の質問で、画面いっぱいにタイルのように要素を増やす方法を教えてもらいました。
それをランダムで全部非表示にしていきたいです。
https://black-flag.net/jquery/20130327-4522.html
このサイトを参考にして、画像では上手くランダムで非表示出来たのですが、いざ　.item2　でやってみると出来ません、、、
エラーも出てないのですが
この組み合わせ方はそもそもだめなのですか？？

<div id="loader" class="loader"> <div class="layer"></div> <div class="grid" style="position:absolute;top:0px;left:0px;z-index:100;"></div> </div> .item2{ width: 100px; height: 100px; will-change: opacity, background; transition: background 0.7s cubic-bezier(0.215, 0.61, 0.355, 1); position: absolute; z-index: 100; background:#3AFF00; border: 1px solid #888888; } <script> $(function(){ var w = document.documentElement.clientWidth; var h = document.documentElement.clientHeight; var tile_w = 100; var tile_h = 100; var tile_x = (w / tile_w); var tile_y = (h / tile_h); for(var x = 0; x < tile_x; x++) { for(var y = 0; y < tile_y; y++) { $('.grid').append('<div style="position:absolute;z-index:100;" class="item' + x + '_' + y + ' item2"></div>') $('.item' + x + '_' + y).offset({top: y * tile_h, left: x * tile_w}); $('.item' + x + '_' + y).height(tile_h); $('.item' + x + '_' + y).width(tile_w); } } }); </script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script> $(function(){ var setElm = $('.item2'), delaySpeed = 50, fadeSpeed = 100; $(window).load(function(){ randomShow(); function randomShow(){ var elmLength = setElm.length, randomSet = Math.floor(Math.random()*elmLength); $(setElm[randomSet]).css({display:'none',opacity:'1'}).animate({opacity:'0'},fadeSpeed); setElm.splice(randomSet,1); if (elmLength > 0) { setTimeout(function(){randomShow();},delaySpeed); } else { return false; //全てロード終了後に処理を加える際はココに } } }); }); </script>