JQuery - Справка по функции .remove()

Question

У меня проблема с моим кодом, я просто добавляю функцию remove(), и вижу только одну проблему с этим разделом сайта и секцией PRM.

Вот видео захват «проблемы»: http://recordit.co/HGak32nwpy
Когда я добавляю элементы, я не хочу, чтобы стереть последний прилагаемую но последний из моей секции. Например, если я добавлю 2 сайта в первую компанию и 3 других на вторую компанию. Если я нажму кнопку remove() на первой компании, я хочу только добавить последний сайт FROM из первой компании, а не последнюю созданную. То же самое для раздела PRM.

Заранее благодарим за вашу помощь!

Here is a JSFiddle for the code

$(document).ready(function() { 
 
    var counter = 2; 
 
    $('#btnAdd').on('click', function() { 
 
    $('#company').append('<li><hr> Company N°' + counter + ' <input id="siteAdd" type="button" value="Add Site" /><input id="siteRemove" type="button" value="X"/></li>'); 
 
    counter++; 
 
    }); 
 
    $("#btnRemove").on('click', function() { 
 
    if (counter == 2) { 
 
     alert("You need to have at least one company !"); 
 
     return false; 
 
    } 
 
    $('li:last').remove(); 
 
    counter--; 
 
    }); 
 
}); 
 

 
$(document).ready(function() { 
 
    var counter = 1; 
 
    $('#company').on('click', '#siteAdd', function() { 
 
    $(this).closest('li').append('<p>Site N°' + counter + ' <input id="prmAdd" type="button" value="Add PRM" /><input id="prmRemove" type="button" value="X" /></p>'); 
 
    counter++; 
 
    }); 
 
    $('#company').on('click', '#siteRemove', function() { 
 
    if (counter == 1) { 
 
     alert("You need to have at least one site !"); 
 
     return false; 
 
    } 
 
    $('p:last').remove(); 
 
    counter--; 
 
    }); 
 
}); 
 

 
$(document).ready(function() { 
 
    var counter = 1; 
 
    $(document).on('click', '#prmAdd', function() { 
 
    $(this).closest('li p').append('<span style="margin-left: 10px;">PRM N°' + counter + '</span>'); 
 
    counter++; 
 
    }); 
 
    $(document).on('click', '#prmRemove', function() { 
 
    if (counter == 1) { 
 
     alert("You need to have at least one PRM !"); 
 
     return false; 
 
    } 
 
    $('span:last').remove(); 
 
    counter--; 
 
    }); 
 
});

<div id="company"> 
 
    <li> Company N°1 
 
<input id="siteAdd" type="button" value="Add Site" /> 
 
<input id="siteRemove" type="button" value="X" /> 
 
    </li> 
 
</div> 
 
<br> 
 
<input id="btnAdd" type="button" value="+ Company" /> 
 
<input id="btnRemove" type="button" value="- Company" /> 
 
<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.4.min.js"></script>

Answer 1

Вы всегда получаете последнюю P на странице и удалить его, измените следующий код

$('p:last').remove(); 

в

$(this).closest('li').find('p:last').remove();