title: Search filter by data
body: <p>I try to filter data by using jQuery/HTML selector like</p>
  
  <pre><code>$("li[data-filter*='keyword']")
  </code></pre>
  
  <p>But this cannot filter and get same result <strong>"keyword1 keyword2"</strong> and <strong>"keyword2 keyword1"</strong> , Do you understand ?</p>
  
  <p>I will give you demo..</p>
  
  <p><strong>HTML :</strong></p>
  
  <pre><code>&lt;input&gt;
  
  &lt;li data-filter="apple pie gummi bears gummi bears john"&gt;
      Apple pie gummi bears gummi bears John
  &lt;/li&gt;
  
  &lt;li data-filter="oat cake chocolate bar chupa chups dessert tootsie"&gt;
      Oat cake chocolate bar chupa chups dessert tootsie
  &lt;/li&gt;
  &lt;li data-filter="jujubes cookie sugar plum lemon drops candy"&gt;
      Jujubes cookie sugar plum lemon drops candy
  &lt;/li&gt;
  </code></pre>
  
  <p><strong>jQuery :</strong></p>
  
  <pre><code>var filter_timer;
  $("input").keypress(function() {
      clearTimeout(filter_timer);
      filter_timer=setTimeout(function(){
          filter();
      },500);
  });
  
  function filter() {
  
  var keyword = $("input").val();
  
  if($("li[data-filter*='"+keyword+"']").length) {
      $("li").animate({opacity:0.4}).css({"text-decoration":"line-through"});
      $("li[data-filter*='"+keyword+"']").animate({opacity:1}).css({"text-decoration":"blink"});
  }else{
      $("li").animate({opacity:1},function(){$("li").removeAttr("style")});}
  }
  </code></pre>
  
  <p><strong>Playground :</strong> <a href="http://jsfiddle.net/9eaXD/" rel="nofollow noreferrer">http://jsfiddle.net/9eaXD/</a></p>
  
  <p>How can I get same result when I searching <strong>apple pie</strong> and <strong>pie apple</strong> or <strong>apple gummi pei</strong></p>