title: Stop jquery iteration if the .search method will be equal to -1
body: <p>I built a nice tools in order to find my store on a google maps which iterate every location from a javascript object. I need a "no search result" when my .search function won't find any result. The problem is that my code will iterate with every location anyway, so it will create a multiple text for all of my locations. Is there anyway to fix this problem? Here is it my code:</p>
  
  <p>The javascript:</p>
  
  <pre><code>    var output = '&lt;div class="searchresults"&gt;';
      $.each(markers, function(key, markers) {    
          output += '&lt;div&gt;';
          output += '&lt;h2&gt;'+ markers.title +'&lt;/h2&gt;';
          output += '&lt;div&gt;'+ markers.html +'&lt;/div&gt;';
          output += '&lt;div&gt;'+ markers.city +'&lt;/div&gt;';
          output += '&lt;div&gt;'+ markers.postalcode +'&lt;/div&gt;';
          output += '&lt;div&gt;'+ markers.phone +'&lt;/div&gt;';
          output += '&lt;/div&gt;';
  
      });
      output += '&lt;/div&gt;';
      $('#legend').html(output);
  
      $('#geocomplete').keyup(function() {
          var searchField = $('#geocomplete').val();
          var myExp = new RegExp(searchField, "i");
          var output = '&lt;div class="searchresults"&gt;';
          $.each(markers, function(key, markers) {
              if (markers.city.search(myExp) == -1 &amp;&amp; markers.postalcode.search(myExp) == -1) {
                  output += ( "&lt;p&gt;No search result&lt;/p&gt;" );
              } else {
                  output += '&lt;div&gt;';
                  output += '&lt;h2&gt;'+ markers.title +'&lt;/h2&gt;';
                  output += '&lt;div&gt;'+ markers.html +'&lt;/div&gt;';
                  output += '&lt;div&gt;'+ markers.city +'&lt;/div&gt;';
                  output += '&lt;div&gt;'+ markers.postalcode +'&lt;/div&gt;';
                  output += '&lt;div&gt;'+ markers.phone +'&lt;/div&gt;';
                  output += '&lt;/div&gt;';
              }
          });
          output += '&lt;/div&gt;';
          $('#legend').html(output);
      });
  
  }
  google.maps.event.addDomListener(window, 'load', initialize);
  </code></pre>
  
  <p>and the html:</p>
  
  <pre><code>    &lt;div class="container-fluid map"&gt;
          &lt;h2&gt;Where To Buy&lt;/h2&gt;
          &lt;fieldset&gt;
              &lt;legend&gt;Find a Store Near You&lt;/legend&gt;
              &lt;form&gt;
                  &lt;input id="geocomplete" class="controls" type="text" placeholder="Start typing your City or Postal Code to get your Chickapea!" size="60" /&gt;
                  &lt;input id="find" type="button" value="Find" /&gt;
              &lt;/form&gt;
          &lt;/fieldset&gt;
          &lt;div id="legend"&gt;&lt;/div&gt;
          &lt;div class="container-fluid" id="map-canvas-two"&gt;&lt;/div&gt;
      &lt;/div&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>