Jquery filtering through a multiple range of numbers

Think I'm getting stuck... I'm attempting to take a list of items and create filters based on attributes to the object. I stripped it down into an easier example of books with a cost and year. I currently have a list of books on the page and filters (checkboxes) that can be selected to only show books within a range of cost and/or year. Here is the code I have so far:

<div id="filters">
<h1>FILTERS</h1>
<div class="filter filter_cost">
    <input class="target" type="checkbox" min="0" max="9" />Under $10.00<br/>
    <input class="target" type="checkbox" min="10" max="19" />$10-$19<br/>
    <input class="target" type="checkbox" min="20" max="29" />$20-$29<br/>
    <input class="target" type="checkbox" min="30" max="39" />$30-$39<br/>
    <input class="target" type="checkbox" min="40" max="1000" />$40 and Over<br/>
</div>
<div class="filter filter_year">
    <input class="target" type="checkbox" min="1700" max="1799" />18th Century<br/>
    <input class="target" type="checkbox" min="1800" max="1899" />19th Century<br/>
    <input class="target" type="checkbox" min="1900" max="1999" />20th Century<br/>
  开发者_如何学JAVA  <input class="target" type="checkbox" min="2000" max="2999" />21st Centruy<br/>
</div>
</div>
<div id="books">
<h1>BOOKS</h1>
<div class="book">
    <h1>Book 1</h1>
    <input type="hidden" name="cost" value="13" />
    <input type="hidden" name="year" value="1997" />
</div>
<div class="book">
    <h1>Book 2</h1>
    <input type="hidden" name="cost" value="22" />
     <input type="hidden" name="year" value="1872" />
</div>
</div>

And my jQuery (using 1.6.2):

$(document).ready(function () {
$("input.target").change(function () {
    filterResults();
});
});

function filterResults(){
$(".book").each(function () {
    var cost = $(this).find("input[name='cost']").val();
    var year = $(this).find("input[name='year']").val();
    var cover = $(this).find("input[name='cover']").val();
    var isHidden = false;
    //console.log("Cost in Range: "+filterRange(cost, ".filter_cost"));
    //console.log("Year in Range: "+filterRange(year, ".filter_year"));

    var filterCost = filterRange(cost, ".filter_cost")?showBook($(this)):hideBook($(this));
    var filterYear = filterRange(year, ".filter_year")?showBook($(this)):hideBook($(this));
    isHidden?"":filterCost;
    isHidden?"":filterYear;

    function showBook(obj) {
        obj.show();
    }

    function hideBook(obj) {
        isHidden = true;
        obj.hide();
    }

})
}

function filterRange(amount, elem) {
var checkedInputs = $(elem).find("input:checked").length;
var totalInputs = $(elem).find("input").length;
var inRange = function(){
    $(elem).find("input:checked").each(function () {
        var min = $(this).attr('min');
        var max = $(this).attr('max');
        if(amount >= min && amount <= max){
            return true;
        } else {
            return false;
        }
    });
};
if(checkedInputs == 0 || totalInputs == checkedInputs ){
    return true;
} 
if(inRange()){
    return true;
} else {
    return false;
}
}

My issue is that in the filterRange function I'm not sure how to create a range of conditionals based on each input that is checked. So that a price range could be 10-19 and 30-39. My attempt (var inRange) was to go through each checked input, check if the cost was with in the range, then return true, else return false. I think I'm just fundamentally getting off track and unsure if this method would work at all. Any input would be much appreciated.

In the jquery each loop on dom element return statement breaks out of the loop. So your implemenation is wrong. Try this.

function filterRange(amount, elem) {
    var checkedInputs = $(elem).find("input:checked").length;
    var totalInputs = $(elem).find("input").length;
    var returnValue = false;

    $(elem).find("input:checked").each(function () {
        var min = $(this).attr('min');
        var max = $(this).attr('max');
        if(amount >= min && amount <= max){
            returnValue = true;
            return true;
        } 
     });

   return (checkedInputs == 0 || totalInputs == checkedInputs || returnValue );
}

Try:

function filterRange(amount, elem) {
    var checkedInputs = $(elem).find("input:checked").length;
    var totalInputs = $(elem).find("input").length;
    var inRange = false;
    $(elem).find("input:checked").each(function () {
        var min = $(this).attr('min');
        var max = $(this).attr('max');
        if (amount >= min && amount <= max) {
            inRange = true;
            return false;
        }
    });

    if (checkedInputs == 0 || totalInputs == checkedInputs) {
        return true;
    }
    if (inRange) {
        return true;
    } else {
        return false;
    }
}