Random number

by Jayson Buquia

HTML

<div id="form">
    <div>
        <label for="min">
            Min:
            <input type="number" id="min">
        </label>
    </div>
        <div>
        <label for="max">
            Max:
            <input type="number" id="max">
        </label>
    </div>
    <div class="btn">Get Random Int</div>
</div>

<ul class="list">
    
</ul>

SCSS

#form {
    position: fixed;
    right: 0;
    top: 0;
}

.btn {
    margin: 10px;
    display: inline-block;
    padding: 10px 20px;
    color: lightGreen;
    background: green;
    cursor: pointer;
    font-family: sans-serif;
    text-transform: uppercase;
    transition: all 0.2s ease;
    
    &:hover {
        background: darkGreen;
    }
    
}

JavaScript

function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min + 1)) + min;
}

function getMin(){
	return Number($('#min').val());
}

function getMax(){
	return Number($('#max').val());
}

$('.btn').click(function(){
	$('.list').append($('<li>').text(getRandomInt(getMin(), getMax())));
});