JSFiddle - React, Tailwind, and code Playground

by elclanrs

HTML

<button>Random</button><span></span>

CSS

body { margin: 40px; }
button {
    border: none;
    background: darkcyan;
    color: azure;
    padding: .7em 1em;
    border-radius: 2px;
    cursor: pointer;
}
button::-moz-focus-inner { border: 0; }
button:active {
    position: relative;
    top: 1px; right: 1px;
    background: darken(darkcyan, 3%);
}
span {
    padding: .5em 1em;
    background: azure;
    border: 1px solid darkcyan;
    color: darkcyan;
    margin: 0 1em;
    border-radius: 2px;
}

JavaScript

/**
* range Get an array of numbers within a range
* @param min {number} Lowest number in array
* @param max {number} Highest number in array
* @param rand {bool} Shuffle array
* @return {array}
*/
function range( min, max, rand ) {
  var arr = ( new Array( ++max - min ) )
    .join('.').split('.')
    .map(function( v,i ){ return min + i })
  return rand
    ? arr.map(function( v ) { return [ Math.random(), v ] })
       .sort().map(function( v ) { return v[ 1 ] })
    : arr
}
        
$('span').text( range( 0,10,true ).join(' | ') )    
        
$('button').click(function() {
   $('span').text( range( 0,10,true ).join(' | ') )
})