Change button to selectbox code change
<p>i have my script working but currently it used a button input, i want to change it to a select box input, but i cant seem the get the code to work at all, please help </p>

<pre><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt;
&lt;head&gt;


&lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;          
&lt;script type="text/javascript"&gt;
$(function() {
var fuel = ''; // Keep track of selections
var drive = '';
var type = '';
$('#fuel button').click(function() { // Choose a fuel
    fuel = (this.id ? '.' : '') + this.id;
    selectModels();
});
$('#drive button').click(function() { // Choose a drive
    drive = (this.id ? '.' : '') + this.id;
    selectModels();
});
$('#type button').click(function() { // Choose a colour
    type = (this.id ? '.' : '') + this.id;
    selectModels();
});
function selectModels() { // Select matching models
    $('div.modelContainer').hide(). // Hide all
        filter((fuel + drive + type) || '*').show(); // Show matches
}
});
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
&lt;div id="fuel" class="controller"&gt;
&lt;span class="controllerLabel"&gt;fuel:&lt;/span&gt;
&lt;button&gt;All&lt;/button&gt;
&lt;button id="petrol"&gt;petrol&lt;/button&gt;
&lt;button id="diesel"&gt;diesel&lt;/button&gt;
&lt;/div&gt;
&lt;div id="drive" class="controller"&gt;
&lt;span class="controllerLabel"&gt;drive:&lt;/span&gt;
&lt;button&gt;All&lt;/button&gt;
&lt;button id="man"&gt;manual&lt;/button&gt;
&lt;button id="auto"&gt;auto&lt;/button&gt;

&lt;/div&gt;
&lt;div id="type" class="controller"&gt;
&lt;span class="controllerLabel"&gt;type:&lt;/span&gt;
&lt;button&gt;All&lt;/button&gt;
&lt;button id="car"&gt;car&lt;/button&gt;
&lt;button id="4"&gt;4x4&lt;/button&gt;
&lt;button id="7"&gt;people&lt;/button&gt;
&lt;button id="van"&gt;van&lt;/button&gt;

&lt;/div&gt;



&lt;div class="modelContainer petrol manual car"&gt;

pmc

&lt;/div&gt;

&lt;div class="modelContainer petrol manual 4"&gt;

pm4

&lt;/div&gt;



&lt;div class="modelContainer petrol auto car"&gt;

pac

&lt;/div&gt;


&lt;div class="modelContainer diesel manual car"&gt;

dmc

&lt;/div&gt;



&lt;div class="modelContainer diesel manual van"&gt;

dmv

&lt;/div&gt;

&lt;div class="modelContainer diesel auto car"&gt;

dac

&lt;/div&gt;

&lt;div class="modelContainer diesel auto 4"&gt;

da4

&lt;/div&gt;

&lt;div class="modelContainer diesel auto 7"&gt;

da7

&lt;/div&gt;

&lt;div class="modelContainer diesel auto 7 4"&gt;

sor

&lt;/div&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>And change the "fuel" buttons to  </p>

<pre><code>&lt;div id="fuel" class="controller"&gt;
&lt;span class="controllerLabel"&gt;fuel:&lt;/span&gt;
&lt;select&gt;
&lt;option value="all"&gt;all&lt;/option&gt;
&lt;option value="petrol"&gt;petrol&lt;/option&gt;
&lt;option value="diesel"&gt;diesel&lt;/option&gt;
&lt;/select&gt;
&lt;/div&gt;
</code></pre>

<p>Thanks</p>
