Question

I’m trying to set up a filter using jQuery. I’ll have a certain amount of divs, each with a numeric value (let’s say price).

I want to have a textbox and button that filters out any divs that are higher than the value given. So for instance, if I enter 10 and hit filter, all divs with a numeric value of 10 or above are hidden.

I can only find filter scripts that are executed via buttons like this, but none of those use a numeric value.

Any help is greatly appreciated. Please bear in mind that my JavaScript skills are limited!

Answer 1

Here is the thing:

http://jsfiddle.net/SMPAq/1/

UPDATE:

Ok, here is the whole thing:

<script>
function sortmebaby()
{
    var divList = $('#containerMonkey div[id^="monkey_"]');  

$.each(divList, function(index, value)
{
    console.log($(value).attr('xprice'));
    if ( $(value).attr('xprice') > $('#mankipower').val())
        $(value).hide();
    else
        $(value).show();
    //alert(index + ': ' + value);
});

}
</script>

<div id="containerMonkey">
    <div id="monkey_1" xprice="1">1</div>
    <div id="monkey_2" xprice="2">2</div>
    <div id="monkey_3" xprice="3">3</div>
    <div id="monkey_4" xprice="4">4</div>
    <div id="monkey_5" xprice="5">5</div>
</div>
<input type="text" name="mankipower" id="mankipower">
<input type="button" value="PUSH" onclick="sortmebaby()">