r.r
r.r

Reputation: 7153

how to set one static <li> as a last entry in generic <ul> with many <li>'s

i have generic ( all data will be loaded in javascript/jquery function) list.

function:

var contentarticles = articles.contentarticles,
    article,
    $out = $("#articlesOutput");

    contentarticlesAll = contentarticles;

    for (var i = 0; i < contentarticles.length; i++) {
        if (!article || article.title != contentarticles[i].title) {
            article = contentarticles[i];

            document.getElementById('articleForNaviTopTitle').innerHTML = contentarticles[currentImageNr - 1].title;
            document.getElementById('articleForNaviTopStepNr').innerHTML = currentImageNr;

            var articlesOutput = [
                '<li><a href="./certifiedTraining.html?step=', i + 1, '">',
                article.title,
                '</li>'
            ].join("");
            $out.append(articlesOutput);
        }
    }

it looks like:

1. step 1
2. step 2
3. step 3

but i want to add some static link into it. doing it like this:

<ul id="articlesOutput">
    <li> <a href="./certifiedTraining.html?step=fragenkatalog">Fragenkatalog</a></li>
</ul>

and its my output:

    1. Fragenkatalog
    2. step 1
    3. step 2
    4. step 3

how to make the static entry as a last, like this?

  1. step 1
  2. step 2
  3. step 3
  4. Fragenkatalog

Upvotes: 1

Views: 73

Answers (2)

lonesomeday
lonesomeday

Reputation: 237845

You should probably use the before method. This adds content as the preceding sibling of an element.

First, store a reference to the element that you want to keep at the end.

$out = $("#articlesOutput"),
$last = $out.children().first();

Then insert the new content before that element:

$last.before(articlesOutput);

Upvotes: 2

user2142786
user2142786

Reputation: 1482

you have to use jquery for it and use this code to get the

$(document).ready(function(){
     $("#articlesOutput").append("<li>Fragenkatalog</li>");
 });

Upvotes: 0

Related Questions