jQuery <ol> remove <li> element

Description

jQuery <ol> remove <li> element

View in separate window

<!DOCTYPE html>
<html lang="en">
<head>
<title>jQuery Bind Click Event to Dynamically added Elements</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script>
    $(document).ready(function(){
        $("button").click(function(){
            $("ol").append("<li>list item <a href='javascript:void(0);' class='remove'>&times;</a></li>");
        });//  ww w  .j  a  va2 s . c om
        $(document).on("click", "a.remove" , function() {
            $(this).parent().remove();
        });
    });
</script>
</head>
<body>
    <button>Add new list item</button>
    <ol>
        <li>list item</li>
        <li>list item</li>
        <li>list item</li>
    </ol>
</body>
</html>



PreviousNext

Related