Solved

Jquery creating list from array

Posted on 2015-02-19
3
259 Views
Last Modified: 2015-02-19
Hello experts.
I'm stucking with my list i want to create from one array.
The problem is as follow
Usig the following code:
var cList = $('#catlist');
var catValues = new Array();
$('#myholder').find('li.ui-selected').each(function() {
   catValues.push($(this).text());
});
$.each(catValues, function(i) {
 var li_a = $('<li/>').appendTo(cList);
 var span = $('<span/>').addClass('test').text(catValues[i]).appendTo(li_a);
})

Open in new window

i get the output like:
<ul id="catlist">
 <li>
 <span class="test">my text</span>
</li>
</ul>

The result i need is:
<ul id="catlist">
 <li>
 <span class="test"></span>my text
</li>
</ul>

(the text after the span)
Any help please??
0
Comment
Question by:Panos
  • 2
3 Comments
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 500 total points
ID: 40620256
Hi,
here we go:
    var cList = $('#catlist');
    var catValues = new Array();
    $('#myholder').find('li.ui-selected').each(function() {
       catValues.push($(this).text());
    });
    catValues.push('Test One');
    catValues.push('Test Two');
    catValues.push('Test Three');
    catValues.push('Test Four');
    $.each(catValues, function(i) {
         var li_a = $('<li/>').appendTo(cList);
         var span = $('<span/>').addClass('test').appendTo(li_a);
         li_a.append(catValues[i]);
    });

Open in new window


Sample:
http://jsfiddle.net/EE_RainerJ/28fgr4rd/

HTH
Rainer
0
 
LVL 2

Author Comment

by:Panos
ID: 40620267
Thank you Rainer Jeschor
Sometimes the solution is in front of me and i don't see it.
0
 
LVL 2

Author Closing Comment

by:Panos
ID: 40620268
regards
panos
0

Featured Post

What Should I Do With This Threat Intelligence?

Are you wondering if you actually need threat intelligence? The answer is yes. We explain the basics for creating useful threat intelligence.

Join & Write a Comment

by Julian Matz As of jQuery (http://jquery.com/) 1.4 the .live() method (http://api.jquery.com/live/) supports custom events as well as some standard JavaScript events that it previously didn't support. Among these is the submit event. Unlike …
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

706 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

18 Experts available now in Live!

Get 1:1 Help Now