IE9 - Multiple appends raise an error

IE9 - Multiple appends raise an error

In IE9 the following code raises an: "Object doesn't support this property or method" in line 5460 of jquery-1.5.js

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
       <!-- <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />-->
        <script type="text/javascript" src="Scripts/jquery-1.5.js"></script>
        <script type="text/javascript">
            $(document).ready(function () {
                $("#rating").append("Please rate: ");
                for (var i = 1; i <= 5; i++) {
                    $("#rating").append("<a href='#'>" + i + "</a> ");
                }
            });
        </script>
    </head>
    <body>
        <h2>
            Ratings</h2>
        <div id="rating">
        </div>
    </body>
    </html>




















Uncommenting the meta tag (IE working in IE8 mode allows the code to execute OK.

A possible workaround is modifying the code as follows:

  1.     <script type="text/javascript">
            $(document).ready(function () {

                var s = "Please rate: ";
                for (var i = 1; i <= 5; i++) {
                    s += "<a href='#'>" + i + "</a> ";
                }
                $("#rating").append(s);
            });
        </script>