JavaScript not comparing minimum greater than maximum number values

Question

Why is "greater than" comparisons for number values in JavaScript not working. The example below keeps returning true even when the mini number is less than the maxi.

mini and maxi are form input values. This example is using jQuery to get the values, but could easily be stripped.

var mini = $('form#filterPrice input.min').val(); //eg. 500
var maxi = $('form#filterPrice input.max').val(); //eg. 1500

if( mini.valueOf() > maxi.valueOf() ) { //also used: mini > maxi
    alert('test'); //alerts "test" even when mini is less than maxi
$('form#filterPrice input.min').val( maxi ); //should switch values if mini > maxi
$('form#filterPrice input.max').val( mini );
}

Replacing "mini > maxi" with "Math.max(mini, maxi) == mini" works fine. So, the following does work:

var mini = $('form#filterPrice input.min').val(); //eg. 500
var maxi = $('form#filterPrice input.max').val(); //eg. 1500

if( Math.max(mini, maxi) == mini ) {
    alert('test'); 
$('form#filterPrice input.min').val( maxi );
$('form#filterPrice input.max').val( mini );
}

Answer 1

in first example you are comparing strings and "1500" < "500". In second example Math.max converts the values to numbers.

Answer 2

Use this line to get Int from String

if( parseInt(mini.valueOf(),10) < parseInt(maxi.valueOf(),10) ) { //also used: mini > maxi

sinve you get values to compare from dom like a string. Fist you should parse them into Int and only then compare. Also it is better to put 10 as a second param to be sure the number will be parsed as decimal.