Javascript Add Row to HTML Table & Increment ID

I've gone ahead an taken a stab at a cleaner version of what I think that you are trying to accomplish. I'll walk through the major updates:

1. Updated the button id and name from "button2" to "button1" - I assumed that you would want to keep the indices in sync across the inputs in each row.
2. Changing $(window).load(function() { to $("document").ready(function() { - While either will work, the former will wait until all images have finished loading, while the latter while fire once the DOM has completed building. Unless you REALLY want the images to load first, I'd recommend $("document").ready(), for faster triggering of the code.
3. Removing the [0] references - the primary reason to use [0] after a jQuery selector collection is to reference the DOM version of the selected jQuery element, in order to us a "vanilla" JavaScript method on it. In all cases, you were re-rwapping the variables in $(...), which just converted the DOM element back into a jQuery object, so that extra step was not needed.
4. Changed the .delegate() method to .on() - as Howard Renollet noted, that is the correct method to use for modern versions of jQuery. Note that the "event" and "target" parameters have swapped places in on, from where they were in delegate.
5. Changed the event target from #button2 to :button - this will make sure that all of the buttons in the new rows will also allow you to add additional rows, not just the first one.
6. Switched the clone target from the clicked row to the last row in the table - this will help keep your row numbering consistant and in ascending order. The cloned row will always be the last one, regardless of which one was clicked, and the new row will always be placed at the end, after it.
7. Changed the indexing to use the last row's index as the base for the new row and use a regular expression to determine it - with the table being ordered now, you can always count on the last row to have the highest index. By using the regular expression /^(.+)(\d+)$/i, you can split up the index value into "everything before the index" and "the index (i.e., on or more numbers, at the end of the value)". Then, you simply increment the index by 1 and reattach it, for the new value. Using the regex approach also allows you to easily adapt, it there ever get to be more than 9 rows (i.e., double-digit indices).
8. Updated both the id and name attributes for each input - I assumed that you would want the id and name attributes to be the same for each individual element, based on the initial row, and, you were only updating the id in your code, which would have caused problems when sending the data.
9. Changed $("input:date") to $("input[type='date']) - as Mouser pointed out, this was really the core reason why your code was failing, initially. All of the other changes will help you avoid additional issues in the future or were simply "code quality"-related changes.

So . . . those were the major updates. :) Let me know if I misunderstood what you were trying to do or if you have any questions.

$("document").ready(function() {
	$('#productanddates').on('click', ':button', function () {
		var lastRow = $(this).closest('table').find("tr:last-child");

		var cloned = lastRow.clone();
		cloned.find('input, select').each(function () {
			var id = $(this).attr('id');
			
			var regIdMatch = /^(.+)(\d+)$/; 
			var aIdParts = id.match(regIdMatch);
			var newId = aIdParts[1] + (parseInt(aIdParts[2], 10) + 1);

			$(this).attr('id', newId);
			$(this).attr('name', newId);
		});

		cloned.find("input[type='date']").val('');
		cloned.insertAfter(lastRow);
	});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div class="blue-bar ta-l">
    <div class="container">
        <h1>Submit Your Insurance Renewal Date(s)</h1>
    </div>
</div>
<div class="grey-bar">
    <div class="container">
        <div class="rounded-box">
            <div>
                <label for="name">Name</label>
                <input type="text" id="name" name="name" autocomplete="off" required />
            </div>
            <div>
                <label for="name">Renewal Dates</label>
            </div>
            <table width="100%" border="0" cellspacing="0" cellpadding="5" id="productanddates" class="border">
                    <tr>
                        <td>
                            <select name="insurance_type1" id="insurance_type1">
                                <option></option>
                                <option>Car</option>
                                <option>Home</option>
                                <option>Van</option>
                                <option>Business</option>
                                <option>GAP</option>
                                <option>Travel</option>
                            </select>
                        </td>
                        <td>
                            <input type="date" name="renewal_date1" id="renewal_date1" />
                        </td>
                        <td>
                            <input type="button" name="button1" id="button1" value="+" />
                        </td>
                    </tr>
            </table>
            <div>
                <label for="telephone_number">Contact Number</label>
                <input type="tel" id="telephone_number" name="telephone_number" pattern="\d{11}" autocomplete="off" required />
            </div>
            <div>
                <label for="email">Email Address</label>
                <input type="email" id="email" name="email" autocomplete="off" required />
            </div>
            <div>
                <input name="submit" type="submit" value="Submit" class="btn">
            </div>
        </div>