javascript - JS: Hide random element within -
i have html:
<div class="all"> <div class="single">a</div> <div class="single">b</div> <div class="single">c</div> </div> <div class="all"> <div class="single">a</div> <div class="single">b</div> <div class="single">c</div> </div>
i'd run javascript/jquery on page load shows random "single" div within each of "all" divs. if use code, found here, 1 of "single" divs shows between both of "all" divs apposed "single" div appear in each of "all" divs.
var random = math.floor(math.random() * $('.single').length); $('.single').hide().eq(random).show();
i tried , failed write sort of loop cycles through instances of "all" , reveals 1 of "single" divs, no avail js skills extremely poor.
you can call code on each member of $('.all')
collection:
$('.all').each(function() { var random = math.floor(math.random() * $('.single', this).length); $('.single', this).hide().eq(random).show(); });
.all { margin-bottom: 1em; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="all"> <div class="single">a</div> <div class="single">b</div> <div class="single">c</div> </div> <div class="all"> <div class="single">a</div> <div class="single">b</div> <div class="single">c</div> </div>
Comments
Post a Comment