jquery Recursively filter with tab-switch

[ro6er]

I'm not great with JQuery but I've got quite far this time..

I'm trying to get the below to display the search result when typed, which it kind of does if you type 'rob' and click 'B'. The alphabetical selector works ok:

http://tm.eth3r.co.uk/test3.html

I've popped all the code here, which might be easier to view:

http://jsfiddle.net/ro6er/gQ6Nc/

(ignore all the css, straight from wordpress)

Here's the jquery:

$(function() {
    //a-z switcher
    $(document).ready(function() {
        $('.navigation-tabs a').click(function(){
            switch_tabs($(this));
            return false;
        });
        switch_tabs($('.default-tab'));  
    });
    function switch_tabs(obj)
    {   

            $('.tab-content').hide();


        $('.navigation-tabs a').removeClass("selected");
        var id = obj.attr("data-custom-attr");
        $('#'+id).show();
        obj.addClass("selected");
    }
    //a-z switcher
        if ($("#searchInput").keyup)
        {

 //Declare the custom selector 'containsIgnoreCase'.
      $.expr[':'].containsIgnoreCase = function(n,i,m){
          return jQuery(n).text().toUpperCase().indexOf(m[3].toUpperCase())>=0;
      };

      $("#searchInput").keyup(function(){
 //hide all the rows
          $(".tab-content").find("table").hide();

 //split the current value of searchInput
          var data = this.value.split(" ");
 //create a jquery object of the rows
          var jo = $(".tab-content").find("table");
 //Recursively filter the jquery object to get results. 
          $.each(data, function(i, v){
               jo = jo.filter("*:containsIgnoreCase('"+v+"')");
          });
 //show the rows that match.
          jo.show();
 //Removes the placeholder text 
      }).focus(function(){
          this.value="";
          $(this).css({"color":"black"});
          $(this).unbind('focus');
      }).css({"color":"#C0C0C0"});
        }

});