$(document).ready(function() {

    $('body').on('click', '.anchor3', function() {

        $("a.anchor3:contains('B')").each(function() {

            var pcolor = $(this).parent().css("background-color");

            if(pcolor != "rgb(218, 112, 214)") {

                $(this).parent().css("background-color", "red");

            }

            else {

                $(this).parent().css("background-color", "Orchid");

            }

        });

        $("a.anchor3:contains('b')").parent().css('background-color', 'LightGrey');

        $(this).parent().css('background-color', 'Grey');

    });

});

</script>

this is the output

in the above table b denotes single day booking and B denotes multiple day booking

B with Orchid color background denotes starting day.

here there are two multiple booking  for  id 101.

first one is 01,02,03 and 04

second starts at 05

ie 05,06,07

b and B has class anchor3

my requirement is ,

First time if we press any of the cell with letters b or B.its background color changes to Grey.

next time if we press any of button its background color change to Grey and first one changes to its last color.

means if we click on B with red background color,it should be change to Grey.next if we press another B with red background it should be change to Grey and last one should change to Red.

as per my code this condition is working.

problem is if press B with Orchid background its background is changing to Grey.it fine.

but again i press another B ,last one changing to Red.but i need it should be Orchid.

How to solve it

Regards

Baiju