How do I create a list element in jQuery?

Question

I've tried different solution without much success.

I'm able to add a <li> to my list, but the DOM does not recognize it as a list element and thus I'm not able to manipulate it with jQuery later.

This is the last code I've tried, but I get the error msg:

TypeError: $('</li>').class is not a function

Code:

 var data = '<div> some stuff</div>';
 var index = "index-" + brand_name[0].toLowerCase();

 $("</li>")
   .class(index)
   .text(data)
   .insertAfter($(".brand_list .main-"+index))
   .css('display','list-element');

I've also tried with <li></li> and <li> but I get the same error.

Any help much appreciated.

@RobW Thanks, that helped. My next trick is to add css style. .css() is not doing it. Any suggestions? — Steven
– Steven, Commented Aug 2, 2012 at 22:03
@Steven list-element is not a valid display property. Use list-item. — Rob W
– Rob W, Commented Aug 2, 2012 at 22:07

Darko · Accepted Answer · 2012-08-02 22:01:55Z

5

you should be using .addClass() instead of .class(). More info here: http://api.jquery.com/addClass/

answered Aug 2, 2012 at 22:01

Darko

39k15 gold badges85 silver badges107 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Steven Over a year ago

Thanks, that helped. Do you know how I can add CSS class? .css() is not working.

Darko Over a year ago

the .addClass() method adds a css class to your element... please read the documentation link I posted.

Darko Over a year ago

Sorry misread your question. .css() is correct, but your display:list-element is not. try list-item instead of list-element

Steven Over a year ago

Thanks, that was it. One last question. I'm populating the <li> with a few html elements. Like the code is not, the html elements are shown in clear text. So I guess I hve to create these elements much inthe same way. How do I Add these to the li? By creating the element, then us li.append() ?

Collectives™ on Stack Overflow

How do I create a list element in jQuery?

1 Answer 1

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related