Prev() Method Is Not Applying To The Previous Element

The prev().remove() is not removing the previous sibling of the element. There is a div with class crossSign after every li element, which is inside an a element. When the li is cl

Solution 1:

To improve the solution just add an extra parent "div" and use $(this).parent().remove() to remove the entire parent like this:

$('.crossSign').on('click', function() {
    $(this).parent().remove();
});

and create the parent on each group:

<divid="list-div"><div><ahref="https://www.example.com"><liclass="links"><span>example</span></li></a><divclass="crossSign"><divclass="line1"></div><divclass="line2"></div></div></div><div><ahref="https://www.example.com"><liclass="links"><span>example</span></li></a><divclass="crossSign"><divclass="line1"></div><divclass="line2"></div></div></div><div><ahref="https://www.example.com"><liclass="links"><span>example</span></li></a><divclass="crossSign"><divclass="line1"></div><divclass="line2"></div></div></div><div><ahref="https://www.example.com"><liclass="links"><span>example</span></li></a><divclass="crossSign"><divclass="line1"></div><divclass="line2"></div></div></div><div><ahref="https://www.example.com"><liclass="links"><span>example</span></li></a><divclass="crossSign"><divclass="line1"></div><divclass="line2"></div></div></div><div><ahref="https://www.example.com"><liclass="links"><span>example</span></li></a><divclass="crossSign"><divclass="line1"></div><divclass="line2"></div></div></div></div><scriptsrc="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>