displaying specified div in order based on clicking dynamically displayed dates with jquery/javascript

displaying specified div in order based on clicking dynamically displayed dates with jquery/javascript

Here is my code: http://js.do/jane-d0e/80399

I have predefined div's, each are going to contain different content and styles. I want to have a user enter a start date, and then restrict the end date so they can choose up to 7 days. I have been having a problem implementing the date restriction, I try doing "+7d" for max Date but for some reason it doesn't limit it correctly, it is always showing more than the amount I specify.

So say the user chooses a date range, with 7 days total. The date range appears below. If the user clicks on the first date, the content within the first div is supposed to be displayed only. The next date that is clicked the content in the second div is displayed only, and so on. So div1 maps to first date.. div7 will map to 7th date if there is a seventh date. I thought of trying to do this with next() but this did not work, now when I run the code and select a date it opens the whole set of divs for each selected date rather than the single intended div.

What is the best way to go about achieving this?