How to dynamically set a limited range for my dates via jQuery
<p>I have the following HTML that generates once the DOM is ready..</p>

<pre><code>&lt;div class="session-block mdatepicker"&gt;

&lt;label&gt;Next Appointment Date&lt;/label&gt;

&lt;select class="mdropdown" name="mde502fbrp__40[]" id="mdays"&gt;
&lt;option value=""&gt;&lt;/option&gt;
&lt;option value="1"&gt;1&lt;/option&gt;
&lt;option value="2"&gt;2&lt;/option&gt;
&lt;option value="3"&gt;3&lt;/option&gt;
&lt;option value="4"&gt;4&lt;/option&gt;
&lt;option value="5"&gt;5&lt;/option&gt;
&lt;option value="6"&gt;6&lt;/option&gt;
&lt;option value="7"&gt;7&lt;/option&gt;
&lt;option value="8"&gt;8&lt;/option&gt;
&lt;option value="9"&gt;9&lt;/option&gt;
&lt;option value="10"&gt;10&lt;/option&gt;
&lt;option value="11"&gt;11&lt;/option&gt;
&lt;option value="12"&gt;12&lt;/option&gt;
&lt;option value="13"&gt;13&lt;/option&gt;
&lt;option value="14"&gt;14&lt;/option&gt;
&lt;option value="15"&gt;15&lt;/option&gt;
&lt;option value="16"&gt;16&lt;/option&gt;
&lt;option value="17"&gt;17&lt;/option&gt;
&lt;option value="18"&gt;18&lt;/option&gt;
&lt;option value="19"&gt;19&lt;/option&gt;
&lt;option value="20"&gt;20&lt;/option&gt;
&lt;option value="21"&gt;21&lt;/option&gt;
&lt;option value="22"&gt;22&lt;/option&gt;
&lt;option value="23"&gt;23&lt;/option&gt;
&lt;option value="24"&gt;24&lt;/option&gt;
&lt;option value="25"&gt;25&lt;/option&gt;
&lt;option value="26"&gt;26&lt;/option&gt;
&lt;option value="27"&gt;27&lt;/option&gt;
&lt;option value="28"&gt;28&lt;/option&gt;
&lt;option value="29"&gt;29&lt;/option&gt;
&lt;option value="30" selected="selected"&gt;30&lt;/option&gt;
&lt;option value="31"&gt;31&lt;/option&gt;
&lt;/select&gt;

&lt;select class="mdropdown" name="mde502fbrp__40[]" id="mmonths"&gt;
&lt;option value=""&gt;&lt;/option&gt;
&lt;option value="1"&gt;January&lt;/option&gt;
&lt;option value="2"&gt;February&lt;/option&gt;
&lt;option value="3"&gt;March&lt;/option&gt;
&lt;option value="4" selected="selected"&gt;April&lt;/option&gt;
&lt;option value="5"&gt;May&lt;/option&gt;
&lt;option value="6"&gt;June&lt;/option&gt;
&lt;option value="7"&gt;July&lt;/option&gt;
&lt;option value="8"&gt;August&lt;/option&gt;
&lt;option value="9"&gt;September&lt;/option&gt;
&lt;option value="10"&gt;October&lt;/option&gt;
&lt;option value="11"&gt;November&lt;/option&gt;
&lt;option value="12"&gt;December&lt;/option&gt;
&lt;/select&gt;

&lt;select class="mdropdown" name="mde502fbrp__40[]" id="myears"&gt;
&lt;option value=""&gt;&lt;/option&gt;
&lt;option value="2013" selected="selected"&gt;2013&lt;/option&gt;
&lt;/select&gt;

&lt;/div&gt;
</code></pre>

<p>My goal is to limit the months so that only the next 2 months appear in the dropdown.  So I was able to do that with some jQuery like this...</p>

<pre><code>$('#mmonths option').each(function() {
  var mvalues = parseInt($(this).val());
  if(mvalues &gt; 5) { 
   $(this).remove();
  }
});
</code></pre>

<p>So with that function, I'm pretty much removing any month after May, and that is cool. </p>

<p>But I don't want go back to this code every month, just to make adjustments on my mvalues variable.  Instead I want it know what the current date is X and always show only 2 months ahead of the current date, no matter if its June, July, August, etc...</p>

<p>When it gets to November, I would like to show December and January, etc..</p>

<p>But I am not sure where or how to learn how to do this...</p>

<p>Any advice would be great!</p>
