Question

I am attempting to hide certain elements using the combination of keyup with contains. What I want to do is hide the span elements that do not equal my input values.

For instance, if I input the value 1 the spans containing the values 2 and 3 are hidden, leaving only the span containing the 1 visible. I would also want it to show all of the spans if I then deleted the 1 value from the input

Here is what I have so far, http://jsfiddle.net/8TXDM/36/

Answer 1

var $spans = $(".mydiv span");

$('.myinput').keyup(function() {
    var val = this.value;
    if (val) {
        $spans.filter(':contains(' + val + ')').show();
        $spans.filter(':not(:contains(' + val + '))').hide();
    } else {
        $spans.show();
    }
});

Working demo: http://jsfiddle.net/8TXDM/38/