Поиск в сайте и возвращающие элементы на основе местоположения

Question

HTML хотите показать элементы, основанные на местоположении в .offer_miliage

<div class="offer_list clearfix"> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_01.jpg" alt=""/></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 1</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">32.690</div> <span class="offer_miliage">Nungambakkam</span> 

      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_02.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 2</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">56.300</div> <span class="offer_miliage">Choolaimedu</span> 

      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_03.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 3</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">47.000</div> <span class="offer_miliage">T Nangar</span> 
      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_04.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 4</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">26.750</div> <span class="offer_miliage">Pallavaram</span> 

      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_05.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 5</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">33.300</div> <span class="offer_miliage">Tambaram</span> 
      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_06.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 6</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">44.300</div> <span class="offer_miliage">fort</span> 
      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_07.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 7</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">48.500</div> <span class="offer_miliage">Fort</span> 
      </div> 
     </div> 
    </div> 
    <div class="offer_item clearfix"> 
     <div class="offer_image"><a href="offers-details.html"><img src="images/temp/prod_img_08.jpg" alt=""></a> 

     </div> 
     <div class="offer_aside"> 
       <h2><a href="offers-details.html">Project 8</a></h2> 

      <div class="offer_descr"> 
       <p>content description</p> 
      </div> 
      <div class="offer_data"> 
       <div class="offer_price">63.300</div> <span class="offer_miliage">Nungambakkam</span> 

      </div> 
     </div> 
    </div> 
</div> 
<div class="widget-container widget_adv_filter"> 
     <h3 class="widget-title">ADJUST SEARCH RESULTS</h3> 

    <form action="#" method="get" class="side_form"> 
     <div class="row field_select" style="z-index:8"> 
      <label class="label_title">Location:</label> 
      <select class="select_styled white_select" name="car_year" id='select'> 
       <option value="1">Pallavaram</option> 
       <option value="2">T Nagar</option> 
       <option value="3">Nungambakkam</option> 
       <option value="4">Choolaimedu</option> 
       <option value="5">Fort</option> 
      </select> 
     </div> 
     <div class="row rowSubmit"> <span class="btn btn_search"><input type="submit" value="SEARCH" onClick="go_button();"></span> 

     </div> 

как показать предметы, которые имеющие то же место, когда нажмите на кнопку искали. Я начал java-скрипт, но не мог продвинуться. здесь Java Script

<script type="text/javascript"> 
    function go_button(){ 
var loc=document.getElementByClassName('offer_miliage')[0].innerText; 
if(document.getElementById('select').value==1){ 
//what to write to update .offer_list with .offer_item that 
//have .offer_miliage text pallavaram 
          } 

         }; 
</script> 

друг может у пожалуйста, скажите мне, что случилось с этим скриптом

 function go_button(){ 
     if(document.getElementById('select').value==1){ 
    $(function() { 
    $(".offer_item").search(function(a) { 
     // Find the location name from element 
     var priceAText = $(a).find(".offer_miliage").text(); 
     // Return the result 
     if(priceAText=="Pallavaram"){return true;} 
    }).each(function() { 
    // Add all the elements back into the parent, in order 
      $(this).appendTo(".offer_list"); 
     }); 
    }); 
} 
    }; 

Answer 1

Ваш рабочий пример с JQuery: http://jsfiddle.net/9VQRt/ (выделить найдены данные с красным фоном).

$('body').on('click', '.search_button', function() { 
    var offerCollection = $('.offer_miliage'); 
    $.each(offerCollection, function(ind, val) { 
     if($("#select option:selected").text() == val.innerHTML) { 
      $(this).addClass('red_bg'); 
     } 
    }); 
});