jQuery IE

Composing an element like below works fine in Firefox, but IE throws and error?
I think it doesn’t like the class keyword or something?
anyone?


var courseId = $('<span>', {
    class: 'cCourseId r0',
    text: selectedCourse.find('.cCourseId').text()
}).appendTo(liRequest);

Try changing second line to this:

‘class’: ‘cCourseId r0’,

@CyberAlien - that doesn’t work either. It compiles now, but jQuery throws an error at runtime.

I think that you’ll need to remove class from the attributes list, and add it afterwards using the addClass method

does specifying className work? You can’t specify class because that is a reserved word in JavaScript so JavaScript uses className to refer to the class attribute…

Yes, className should work well. A simple test confirms


<html>
<head>
<title>test</title>
<style type="text/css">
.cCourseId { color: green; }
.r0 { text-decoration: bold; }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(function () {
    var $selectedCourse = $('[name="selectedCourse"]'),
        $liRequest = $('li#request'),
        courseId = $('<span>', {
            className: 'cCourseId r0',
            text: $selectedCourse.find('.cCourseId').text()
        }).appendTo($liRequest);
});
</script>
</head>

<body> 
<select name="selectedCourse">
    <option name="course1">Course 1</option>
    <option name="course2" class="cCourseId" selected="selected">Course 2</option>
</select>
<ul>
    <li id="request"></li>
</ul>
</body>
</html>

Note: variables have been renamed so that for example, liRequest is prefixed with $ (as $liRequest) to indicate that it’s an actual jQuery object.

Thanks guys, className works