Witam
Mam taki kod html

[HTML] pobierz, plaintext 
<table>
    <tr>
       <td id="wolne"></td>
       <td id="wolne"></td>
       <td id="wolne"></td>
       <td id="zajete"><td>
       <td id="zajete"><td>
       <td id="zajete"><td>
       <td id="wolne"></td>
       <td id="zajete"><td>
   </tr>
</table>
[HTML] pobierz, plaintext 

i taki kod javasript

[JAVASCRIPT] pobierz, plaintext 
    $(function () {
	$('[id="dni_wolne"]').click (function () {
           $(this).siblings('#dni_wolne').attr('id','koniec')
[JAVASCRIPT] pobierz, plaintext 

A teraz o co mi chodzi. chodzi mi o to żeby po kliknięciu w td o id wolne wszystkim kolejnym td z id wolne zmieniło id na koniec. To co napisałem zamienia mi wszystkie td a nie tylko następne od klikniętego. Próbowałem już różnych sposobów; ale nic mi nie wychodzi :/ Może ktoś ma jakieś pomysły.

Nikt na prawdę nie ma na to pomysłu?

Zacznij od tego, że id jest unikalne i musi takie być.

Ok mogę zrobić, że id będzie unikalne i co dalej bo nie mam pomysłu :/

Nie możesz musisz
Potem: nextAll i http://jsfiddle.net/SjSx6/

Wielkie dzięki za pomoc A jeszcze takie małe pytanie może będziesz wiedział.
Chodzi mi o to żeby po napotkaniu klasy zajęte kolejne elementy wolne nie były już zaznaczane.
Bardzo mi chodzi o to czy jest takie coś wykonalne w marę prosty sposób i może jakieś ewentualne podpowiedzi jak się za takie coś zabrać.

Tym razem nie dostaniesz gotowca - jedynie podpowiedź

Pobierasz wszystkie elementy za danym ( nextAll ). Następnie lecisz pętlą ( each ) . Dalej w pętli sprawdzasz czy( if ) klasa aktualnego elementu( attr/class ) = 'zajete'. Jeżeli tak to przerywasz pętlę( tu nie jestem pewien, ale chyba break - musisz sprawdzić ), a jeżeli nie to zmieniasz aktualną klasę.

Podsumowując - będzie 2-3 linie
Jeżeli sobie nie poradzisz wróć z kodem - może być niepoprawny, ale pokaż, że coś robiłeś.

Pozdrawiam

A nie był mi potrzebny gotowiec już zrobiłem i pięknie działa
Gdy by komuś było taki coś potrzebne oto przykładowy kod

[HTML] pobierz, plaintext 
<p class="wolne">11</p>
<p class="wolne">12</p>
<p class="zajete">13</p>
<p class="wolne">20</p>
<p class="wolne">21</p>
<p class="zajete">14</p>
<p class="wolne">15</p>
<p class="wolne">16</p>
[HTML] pobierz, plaintext 

[CSS] pobierz, plaintext 
.zajete{ color: red; }
.wolne{ color:  green; }
.koniec{ color: blue; }
[CSS] pobierz, plaintext 

[JAVASCRIPT] pobierz, plaintext 
$(function () {
	$('.wolne').click (function () {
   		var elementy = $(this).nextAll();
		elementy.each(function() {
			if($(this).attr('class') == 'zajete')
			{
				return false;
			}
			else 
			{
				$(this).addClass('koniec');
			}
		})
    })
});
[JAVASCRIPT] pobierz, plaintext 

I mam jeszcze jeden problem. Bo zmieniłem sobie troszkę ten skrypt żeby mi zaznaczał zaznaczony przedział. I przy kliknięciu na wolne dodaję kolor tła i póżniej przy kliknieciu w jakiś dzień zaznaczam daty poprzednie. Tylko chodzi mi o to żeby nie można było kliknąć daty po terminie zajętym więc wszystkim datom po zajętym zmieniłem klasę na blokada ale i tak można zaznaczyć tamte dni :/

Kod po zmianach

http://jsfiddle.net/SjSx6/4/

Wyjaśnij trochę dokładnie. Co mam kliknąć i jak jest, a jak powinno być.

Podejrzewam, że problemem jest addClass. To znaczy, że jeżeli element ma klasę A( class="A" ), a Ty użyjesz addClass("B") to powstanie (class="A B")
Jeżeli natomiast element ma klasę A( class="A" ), a Ty użyjesz attr("class","B") to powstanie (class="B").

Nie wiem czy w tym leży problem, bo do końca nie rozumiem problemu

Chodzi o to że jak ktoś wybierze początek w kalendarzu (bo docelowa jest mi to potrzebne do kalendarza) to żeby mógł zaznaczyć koniec przed rezerwacją.
A teraz jest tak że jak zaznaczę powiedzmy 2 to jak kliknę na 7 (po zaznaczeniu) to on też mi się zaznacz jako początek oczywiście. Może trochę zamotałem; ale ogolnie chodzi o to żeby jak kliknę na 2 to 7 nie dało się zaznaczyć a teraz się da.

Może tak - kod oczywiście do sprawdzenia i ewentualnych poprawek - pisałem na kolanie

[JAVASCRIPT] pobierz, plaintext 
$('.wolne').click (function () {
var nr_click=$(this).index();
    var nr_zajete=$('.zaznaczone:last').nextAll('.zajete').first().index();
    var nr_zajete_prev=$('.zaznaczone:first').prevAll('.zajete').first().index();
 
if(nr_zajete<0){$(this).addClass('zaznaczone');}
else
if(nr_click<nr_zajete && nr_click>nr_zajete_prev)
{
$(this).addClass('zaznaczone');
var elementy = $('.zaznaczone:first').nextAll('.wolne').not('.zaznaczone');
elementy.each(function(i) {if($(this).index()<nr_click){$(this).addClass('zaznaczone')};})
}
 
})
 
[JAVASCRIPT] pobierz, plaintext 

Wielkie dzięki działa jak natura chciała

Jeszcze jedno pytanie odnośnie tematu. Przerobiłem skrypt żeby po najechaniu na datę zmieniało kolor i zostawało a po cofnięciu kursora usuwało klasę z kolorem.
I wszystko ładnie dział. Tylko że nie odznacz mi ostatniego elementu :/

http://jsfiddle.net/SjSx6/7/

Tak, że jeszcze raz proszę o wskazówki i porady