
function addElement(){
  var ni = document.getElementById('mySpan');
  var numi = document.getElementById('theValue');
  var num = (document.getElementById('theValue').value -1)+ 2;
  numi.value = num;
  var newspan = document.createElement('span');
  var spanIdName = 'my'+num+'Span';
  var range = num;
  newspan.setAttribute('id',spanIdName);
  newspan.innerHTML = '<input type=hidden name=range[] value='+range+' />&nbsp;&nbsp;&nbsp;&nbsp;'+range+' &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;'+
                      '<select name=monthStartD[]><option value=1>Jan</option><option value=2>Feb</option><option value=3>Mar</option><option value=4>Apr</option><option value=5>May</option><option value=6>Jun</option><option value=7>Jul</option><option value=8>Aug</option><option value=9>Sep</option><option value=10>Oct</option><option value=11>Nov</option><option value=12>Dec</option></select>'+
                      '&nbsp;<select name=dayStartD[]><option value=1>1</option><option value=2>2</option><option value=3>3</option><option value=4>4</option><option value=5>5</option><option value=6>6</option><option value=7>7</option><option value=8>8</option><option value=9>9</option><option value=10>10</option><option value=11>11</option><option value=12>12</option><option value=13>13</option><option value=14>14</option><option value=15>15</option><option value=16>16</option><option value=17>17</option><option value=18>18</option><option value=19>19</option><option value=20>20</option><option value=21>21</option><option value=22>22</option><option value=23>23</option><option value=24>24</option><option value=25>25</option><option value=26>26</option><option value=27>27</option><option value=28>28</option><option value=29>29</option><option value=30>30</option><option value=31>31</option></select>'+
		      '&nbsp;<input type=text name=yearStartD[] size=4/>&nbsp;&nbsp;&nbsp;&nbsp;'+
                      '<select name=monthEndD[]><option value=1>Jan</option><option value=2>Feb</option><option value=3>Mar</option><option value=4>Apr</option><option value=5>May</option><option value=6>Jun</option><option value=7>Jul</option><option value=8>Aug</option><option value=9>Sep</option><option value=10>Oct</option><option value=11>Nov</option><option value=12>Dec</option></select>'+
                      '&nbsp;<select name=dayEndD[]><option value=1>1</option><option value=2>2</option><option value=3>3</option><option value=4>4</option><option value=5>5</option><option value=6>6</option><option value=7>7</option><option value=8>8</option><option value=9>9</option><option value=10>10</option><option value=11>11</option><option value=12>12</option><option value=13>13</option><option value=14>14</option><option value=15>15</option><option value=16>16</option><option value=17>17</option><option value=18>18</option><option value=19>19</option><option value=20>20</option><option value=21>21</option><option value=22>22</option><option value=23>23</option><option value=24>24</option><option value=25>25</option><option value=26>26</option><option value=27>27</option><option value=28>28</option><option value=29>29</option><option value=30>30</option><option value=31>31</option></select>'+
		      '&nbsp;<input type=text name=yearEndD[] size=4/>&nbsp;&nbsp;&nbsp;'+
                      '<a href=# onclick=removeElement("'+spanIdName+'");>Remove</a><br/>';
  ni.appendChild(newspan);
}

function removeElement(spanNum) {
  var d = document.getElementById('mySpan');
  var oldspan = document.getElementById(spanNum);
  d.removeChild(oldspan);
}


function removeSpan(spanNum) {
  var d = document.getElementById('mySpan2');
  var oldspan = document.getElementById(spanNum);
  d.removeChild(oldspan);
}