title: jQuery - Search image title attribute
body: <p>I have been looking at this jQuery quick filter code here:
  <a href="https://github.com/syropian/jQuery-Quick-Filter" rel="nofollow noreferrer">https://github.com/syropian/jQuery-Quick-Filter</a></p>
  
  <p>I'd like to be able to use it to quick filter a list of images, instead of list items as used in the demo.</p>
  
  <p>The demo uses this:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function(){
          $('#txtSearch').quickfilter('#list li');
      });
  &lt;/script&gt;
  
  ...
  
  &lt;input type="text" id="txtSearch" placeholder="Filter" /&gt;
  &lt;ul id="list"&gt;
      &lt;li&gt;Apples&lt;/li&gt;
      &lt;li&gt;Oranges&lt;/li&gt;
      &lt;li&gt;Pineapples&lt;/li&gt;
      &lt;li&gt;Bananas&lt;/li&gt;
      &lt;li&gt;Dragonfruit&lt;/li&gt;
      &lt;li&gt;Peaches&lt;/li&gt;
      &lt;li&gt;Raspberries&lt;/li&gt;
      &lt;li&gt;Strawberries&lt;/li&gt;
      &lt;li&gt;Blueberries&lt;/li&gt;
      &lt;li&gt;Cantaloupe&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>I'd like to do this:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
      $(document).ready(function(){
          $('#txtSearch').quickfilter('#list img');
      });
  &lt;/script&gt;
  
  ...
  
  &lt;input type="text" id="txtSearch" placeholder="Filter" /&gt;
  
  &lt;div id="list"&gt;
      &lt;img src="a.png" width="5" height="5" title="Apples" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Oranges" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Pineapples" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Bananas" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Dragonfruit" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Peaches" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Raspberries" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Strawberries" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Blueberries" /&gt;
      &lt;img src="a.png" width="5" height="5" title="Cantaloupe" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>In my case, I'd like to be able to filter based on the image's title attribute.</p>
  
  <p>The jQuery Quick Filter code is this:</p>
  
  <pre><code>(function($){
  $.extend($.expr[':'], {missing: function (elem, index, match) {
      return (elem.textContent || elem.innerText || "").toLowerCase().indexOf(match[3]) == -1;
  }});
  $.extend($.expr[':'], {exists: function(elem, i, match, array){
      return (elem.textContent || elem.innerText || '').toLowerCase().indexOf((match[3] || "").toLowerCase()) &gt;= 0;
  }});
  $.extend($.fn,{
      quickfilter: function(el){
           return this.each(function(){
              var _this = $(this);
              var query = _this.val().toLowerCase();
              _this.keyup(function () {
                  query = $(this).val().toLowerCase();
                  if(query.replace(/\s/g,"") != ""){
                      $(el+':exists("' + query.toString() + '")').show();
                      $(el+':missing("' + query.toString() + '")').hide();
                  }
                  else {
                      $(el).show();
                  }
              });
          });
      }
  });
  })(jQuery);
  </code></pre>
  
  <p>I wonder if anyone might be able to provide a pointer about how I can modify it to search on the title attributes please?</p>
  
  <p>I realise the function uses "innerText", and searches on the inner text between the <code>&lt;li&gt;</code> list items.</p>
  
  <p>In this case, it's slightly different as it needs to search the attribute.</p>