删除循环内的多个 JSON 对象

Question

我正在尝试创建一个循环，根据是否有任何<p>元素具有选定的类，从我的 JSON 数组中删除 JSON 对象。

所以，我希望它如何工作是在提交表单时我检查是否有任何<p>元素具有选定的类。如果选择了任何元素，我将使用它们的文本值循环遍历它们以将它们从 JSON 数组中删除，然后我console.log()将删除数组。

我可以使用循环内的代码从数组中删除单个对象，但我似乎无法让它与我的循环一起工作。我怎样才能做到这一点？

JS

$('#form').on('submit', function(e){

    e.preventDefault();

    if( $('.postcodes p.selected').length ){

        $('.postcodes p.selected').each(function(){

            var data_filter = area_json.filter((element) => {

                return element.Sector !== $(this).text();

            });

        });

    }

    console.log(data_filter); 

}); 

var area_json = [

    {

       "Sector": "AB10 1",

       "Locality": "Thistle Court,Aberdeen",

       "Residential": 1147

    },

    {

       "Sector": "AB10 6",

       "Locality": "Great Western Road,Aberdeen",

       "Residential": 4596

    },

    {

       "Sector": "AB10 7",

       "Locality": "Holburn Street,Aberdeen",

       "Residential": 4380

    }

]

HTML

<form id="form" action="" method="post">

    <div class="postcodes">

        <p class="selected">AB10 1</p>

        <p class="selected">AB10 6</p>

    </div>

    <input type="submit" value="submit">

</form>