Using Filters on AJAX Results

JavaScript
1

Hi everyone, I am successful in bringing back data from an XML file using AJAX but ran into problems when I tried to filter the data. Here is my situation, I have a web page that lets users select car images of various brands to view using a dropdown list. When a brand is chosen, AJAX fetches from the XML file the paths to all images of cars from that brand and all data related to each image. Then the images and their related data are displayed on the web page. The following is the schema of my XML file:


  <cars>
      <car>
        <year>2013</year>
        <makemodel> Ford Mustang </makemodel>
      </car>

      <car>
        <year>2013</year>
        <makemodel> Dodge Challenger </makemodel>
      </car>

      <car>
        <year>2013</year>
        <makemodel> Scion FRS </makemodel>
      </car>
  </cars>

I wanted to filter the data based on the selected car brand but I couldn’t get it to work using the following jQuery filter:


    var vehicle = $(data).find("car").filter(function()
                        {   
                              return $.trim($(this).find("makemodel").text()) == $("#mySelection").val();
                        });

In the code above, mySelection is the id of the dropdown list that the users would use to select car brands.
Thanks in advance for your help.