jQuery IE append ul will not apply css style

Question

StackOverlow, Whats up! I am trying to append a new UL inside a div. It works beautifully in every browser except for, you guessed it, IE. Even though the new UL is appended under the current UL's in IE, the CSS styling is not being applied...I am not doing anything super complex. Just making an AJAX call, getting the results and appending them to the containing div.

Here is what I am trying to append:

var toPrint =
    '<ul class="'+listClass+'" id="'+listType+'_' + listId + '">' +
        '<li class="list_title"><label><input id="chk_'+ listType +'_' + listId + '" value="' + listId + '" type="checkbox" checked="checked" name="'+checkName+'"/> <span>New List Name</span></li>' +
        '<li><a class="modal_btn edit_btn" rel="' + editId + '" title="' + listName + '">Edit</a></li>' +
        '<li><a class="delete_list_btn" message="Delete" title="' + mnews.fmt.nl_js_msg17 + '">Delete</a></li>' +
    '</ul>'

And Here is what I am using for the jQuery function:

$('#list_container').append(toPrint);

As this says, I am appending the toPrint variable to the #list_container div ...like I said, it appends, but is broken...

Any ideas StackOverflow??

Thanks! brad

Answer 1

You have an unclosed <label> tag in your first <li>. Without your CSS rules and/or a live page, it's hard to tell if that's the problem, but it could be.