Помогите написать один скрипт

[Pikener]

Нужно написать скрипт простой фильтрации, вот некий "пример":

<select>
<option selected></option>
<option id="1">пункт i</option>
<option id="2">пункт b</option>
<option id="3">пункт c</option>
</select>
<select>
<option selected></option>
<option class="1">пункт а</option>
<option class="2">пункт б</option>
<option class="3">пункт в</option>
</select>
<br />
<div id="1" class="1">текст1 текст1 текст1 текст1</div>
<br />
<div id="2" class="2">текст2 текст2 текст2 текст2</div>
<br />
<div id="3" class="3">текст3 текст3 текст3 текст3</div>
<br />
<div id="1" class="3">текст4 текст4 текст4 текст4</div>
<br />
<div id="2" class="3">текст5 текст5 текст5 текст5</div>
<br />
<div id="3" class="1">текст6 текст6 текст6 текст6</div>
<br />
<div id="1" class="2">текст7 текст7 текст7 текст7</div>

И так, чтобы при выборе определённого(ых) пункта(ов), остовались только те дивы, которые удовлетворяют значениям id и class

Т.е. если выбрать пункт b и пункт в то останется только:
текст5 текст5 текст5 текст5

Или если выбрать исключительно пункт c то останется только:
текст3 текст3 текст3 текст3
текст6 текст6 текст6 текст6

Как такое можно реализовать?

[danik.js]

Для начала id не может повторяться впределах одного документа, он должен быть уникален.

[nurik2120]

но можно следующие))

<div class="a 1">текст1 текст1 текст1 текст1</div>
<br />
<div class="b 2">текст2 текст2 текст2 текст2</div>
<br />
<div class="c 3">текст3 текст3 текст3 текст3</div>
<br />
<div class="a 3">текст4 текст4 текст4 текст4</div>
<br />
<div" class="b 3">текст5 текст5 текст5 текст5</div>
<br />
<div class="c 1">текст6 текст6 текст6 текст6</div>
<br />
<div class="a 2">текст7 текст7 текст7 текст7</div>

[Pikener]

Мне главное сам js...

[danik.js]

Можно так, как самый простой вариант:

<select>
    <option value="" selected></option>
    <option value="a">пункт i</option>
    <option value="b">пункт b</option>
    <option value="c">пункт c</option>
</select>
<select>
    <option value="" selected></option>
    <option value="1">пункт а</option>
    <option value="2">пункт б</option>
    <option value="3">пункт в</option>
</select>

<div id="items">
    <div class="a 1">текст1 текст1 текст1 текст1</div>
    <div class="b 2">текст2 текст2 текст2 текст2</div>
    <div class="c 3">текст3 текст3 текст3 текст3</div>
    <div class="a 3">текст4 текст4 текст4 текст4</div>
    <div class="b 3">текст5 текст5 текст5 текст5</div>
    <div class="c 1">текст6 текст6 текст6 текст6</div>
    <div class="a 2">текст7 текст7 текст7 текст7</div>
</div>
<script>
(function(){
    var selects = document.getElementsByTagName('select');
    var items = document.getElementById('items').children;
    function filter(a, b) {
        var i, classes, matches;
        for (i = 0; i < items.length; i++) {
            classes = items[i].className.split(' ');
            matches = (!a || classes[0] == a) && (!b || classes[1] == b)
            items[i].style.display = matches ? '' : 'none';
        }
    }
    selects[0].onchange = selects[1].onchange = function() {
        filter(selects[0].value, selects[1].value);
    }
})()
</script>

[Pikener]

danik.js,
Большое спс
А возможно как нить увеличить количество select?

[vostok]

А возможно как нить увеличить количество select?

<form>
Я покупаю:<br />
<select>
    <option value="" selected></option>
    <option value="car">Машина</option>
    <option value="moto">Мотоцикл</option>
    <option value="velo">Велосипед</option>
</select>
<br />еду в:<br />
<select>
    <option value="" selected></option>
    <option value="pizza">Ресторан</option>
    <option value="school">Школа</option>
    <option value="home">Домой</option>
</select>
<br />с:<br />
<select>
    <option value="" selected></option>
    <option value="girl">Девушка</option>
    <option value="frends">Друзья</option>
    <option value="yaga">Баба-Яга</option>
</select>
</form>

<div id="items">
    <div class="car girl pizza">Я покупаю машину, и еду с девушкой, в ресторан</div>
    <div class="car girl school">Я покупаю машину, и еду с девушкой, в школу</div>
    <div class="car girl home">Я покупаю машину, и еду с девушкой, домой</div>
    <div class="car frends pizza">Я покупаю машину, и еду с друзьями, в ресторан</div>
    <div class="car frends school">Я покупаю машину, и еду с друзьями, в школу</div>
    <div class="car frends home">Я покупаю машину, и еду с друзьями, домой</div>
    <div class="car yaga pizza">Я покупаю машину, и еду с Бабой-Ягой, в ресторан</div>
    <div class="car yaga school">Я покупаю машину, и еду с Бабой-Ягой, в школу</div>
    <div class="car yaga home">Я покупаю машину, и еду с Бабой-Ягой, домой</div>
    <div class="moto girl pizza">Я покупаю мотоцикл, и еду с девушкой, в ресторан</div>
    <div class="moto girl school">Я покупаю мотоцикл, и еду с девушкой, в школу</div>
    <div class="moto girl home">Я покупаю мотоцикл, и еду с девушкой, домой</div>
    <div class="moto frends pizza">Я покупаю мотоцикл, и еду с друзьями, в ресторан</div>
    <div class="moto frends school">Я покупаю мотоцикл, и еду с друзьями, в школу</div>
    <div class="moto frends home">Я покупаю мотоцикл, и еду с друзьями, домой</div>
    <div class="moto yaga pizza">Я покупаю мотоцикл, и еду с Бабой-Ягой, в ресторан</div>
    <div class="moto yaga school">Я покупаю мотоцикл, и еду с Бабой-Ягой, в школу</div>
    <div class="moto yaga home">Я покупаю мотоцикл, и еду с Бабой-Ягой, домой</div>
    <div class="velo girl pizza">Я покупаю велосипед, и еду с девушкой, в ресторан</div>
    <div class="velo girl school">Я покупаю велосипед, и еду с девушкой, в школу</div>
    <div class="velo girl home">Я покупаю велосипед, и еду с девушкой, домой</div>
    <div class="velo frends pizza">Я покупаю велосипед, и еду с друзьями, в ресторан</div>
    <div class="velo frends school">Я покупаю велосипед, и еду с друзьями, в школу</div>
    <div class="velo frends home">Я покупаю велосипед, и еду с друзьями, домой</div>
    <div class="velo yaga pizza">Я покупаю велосипед, и еду с Бабой-Ягой, в ресторан</div>
    <div class="velo yaga school">Я покупаю велосипед, и еду с Бабой-Ягой, в школу</div>
    <div class="velo yaga home">Я покупаю велосипед, и еду с Бабой-Ягой, домой</div>
</div>
<script>
(function(){
    var form = document.getElementsByTagName('form')[0];
    var selects = form.getElementsByTagName('select');
    var items = document.getElementById('items').children;
		
	function filter(selects) {
		for (var i = 0; i < items.length; i++)
			items[i].style.display = (hasMatch(selects, items[i]) ? '' : 'none');
	}
	
	function hasMatch(selects, item) {
		for(var j = 0; j < selects.length; j+=1)
			if(!hasClass(item, selects[j].value) && selects[j].value != '')
				return false;
		return true;
	}
	
	function hasClass(el, cls) {
	  for (var c = el.className.split(' '),i=c.length-1; i>=0; i--)
			if (c[i] == cls) return true;
	  return false;
	}
	
	form.onchange = function(event) {
		if(event.target.tagName != 'SELECT') return false;
		filter(selects);
	}
})()
</script>

так или убрав эту строку из условия:

&& selects[j].value != ''

Надо еще кроссбраузерность добавить с event.