[Ramundo]

Допустим, у меня есть

<style type="text/css">

.bar{
	border: solid yellow;
	display:inline-block;
	cursor: pointer;
    
}
.selected {
    background: SteelBlue;
}

.cell{
	border: solid blue 2px;
	display:inline-block;
	width:14px;
	height:12px;
	background: PaleTurquoise;
}
</style>

<div class = "bar">
  <div class = "cell" data-val = "1"></div>
  <div class = "cell"  data-val = "2"></div>
  <div class = "cell"  data-val = "3"></div>
  <div class = "cell"  data-val = "4"></div>
  <div class = "cell"  data-val = "5"></div>
  <div class = "cell"  data-val = "6"></div>

</div>

bar - это горизонтальный блок, контейнер шкалы, а cell'ы - значения шкалы

Помогите пожалуйста оживить все енто дело так, чтобы:

- при клике на один cell , он и все cell'ы до него подсвечивались, т.е. приобретали класс selected

- при клике на посвеченный cell, он затухал (selected пропадал),


В общем, типичное поведение шкалы .


Только просьба , без Jquery и попроще , если можно (Рони )