.remove not working

.remove not working

For some reason this will not remove the <li> items generated from Parse API. Although it will remove the <li> items that are already on the DOM. Is this a Parse API problem or jQuery?

Here's the HTML:

  1. <!DOCTYPE html>
    <html lang="en">
        <head>
            <meta charset="utf-8">
            <title>Andria Jade, Ceramics Portfolio</title>       
            <meta name="Adam Yost" content="Check List">
            <link rel="stylesheet" href="reset.css">
            <link rel="stylesheet" href="styles.css">
            <!--[if lt IE 9]>
            <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
            <![endif]-->
            <script type="text/javascript" src="http://www.parsecdn.com/js/parse-1.1.15.min.js"></script>
            <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
            <script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
            <script src="script.js"></script>
           
           
        </head>
       
        <body>
            <div id="wrapper">
                <form>
                    <input type="text" name="item" value="Add To List" id="item" onfocus="if(this.value=='Add To List') this.value=''" onblur="if(this.value=='') this.value='Add To List'">       
                </form>
                <div id="button">Add</div>
                <h2>Remove</h2>
                <ul>
                    <li>Item 1<span>&nbsp;REMOVE</span></li>
                    <li>Item 2<span>&nbsp;REMOVE</span></li>
                    <li>Item 3<span>&nbsp;REMOVE</span></li>
                    <li>Item 3<span>&nbsp;REMOVE</span></li>
                    <li>Item 3<span>&nbsp;REMOVE</span></li>           
                </ul>       
               
                <div id="archive"></div>
            </div>
        </body>
       
    </html>





































Here's the script.js. Note I've left out my application ID and javascript ID

  1. $(document).ready(function(){   
        Parse.initialize("appilcation ID","javascript ID");
        var query = new Parse.Query('Post');   
        query.find({
            success: function(results) {            
                for (var i = 0; i < results.length; i++) {                       
                    $('ul').prepend('<li>' + results[i].get("task") + '</li>' + '<span>REMOVE</span>');
                }   
            },
            error: function(error) {
                console.log("An error occured");
            }
        });
       
       
        $('span').click(function(){
            console.log('Hello World');
            $('li').remove();
        });
    });