Add and delete rows with jQuery

custom-js.js

$(window).load(function(){
 
 $(function() {
 
 var scntDiv = $('#listValue');
 var i = $('#listValue').size() + 1;
 
 $(document).on('click','#addItem', function() {
 $('<span><input name="inputName[]" type="text" /> <a id="delItem" href="#">Delete Row</a><br /></span>').appendTo(scntDiv);
 i++;
 return false;
 });
 
 $(document).on('click','#delItem', function() {
 if( i > 2 ) {
 $(this).parents('span').remove();
 i--;
 }
 return false;
 });
 
 });
 
});

index.html

<script src="https://code.jquery.com/jquery-2.1.1.min.js"></script>
<script src="custom-js.js"></script>
<ul class="addDelList">
    <li id="listValue">
        <input name="inputName[]" type="text">
        <a href="#" id="addItem">Add Row</a><br />
    </li>
</ul>