Append same number of
as the value of variable

Question

In my case i have a mysql database with some content from a page. I have function on a page to add more <li> to the database, basically it just add 1 to the number in database.

On another page i would like to display the list, how do i add the same number of <li>as the number of a variable made by the php?

var number_of_items = 6; // Printet by the php

$('.list_container').append('<li></li>'); // 6 times

I then want to append 6 times or what wver the number is.

How do i do this?

add a String.prototype method `repeat()` , as suggested here: http://stackoverflow.com/questions/202605/repeat-string-javascript , so the code becomes `.append('

score 6 · Accepted Answer · answered Feb 24 '14 at 11:00

6

Try a neat little hack using Array.join()

$('.list_container').append(new Array(number_of_items + 1).join('<li></li>'))

Demo: Fiddle

answered Feb 24 '14 at 11:00

Arun P Johny

384,651
66
527
531

Master can you explain a little bit your code?..please..please `new Array(number_of_items + 1).join('

Deepak Ingole

Feb 24 '14 at 11:04

1

@Pilot we create an empty array of `x + 1` nodes, then when we call join using on that array the empty array will be joined by the passed separator which will result in a string which is repeated x times – Arun P Johny Feb 24 '14 at 11:06

Nice soultion, i really like it :) Is there a way to give each `

` its own id? like id="1", id="2" etc? not need it to, but if there is an easy way it would be cool.

– Legarndary Feb 24 '14 at 11:09

score 0 · Answer 2 · answered Feb 24 '14 at 11:00

0

try

for(i=0;i<number_of_items;i++)
{
  $('.list_container').append('<li></li>');
}

answered Feb 24 '14 at 11:00

Anoop Joshi P

25,373
8
32
53

2

didn't downvoted, but this is awful for the performance. You call jQuery, access the list and call the append method `number_of_times` times – Fabrizio Calderan Feb 24 '14 at 11:05
1

The var statement should never be left out unless the desired effect is to affect the outer scope. http://bonsaiden.github.io/JavaScript-Garden/#function.scopes – Nostalgie Feb 24 '14 at 11:06

score 0 · Answer 3 · answered Feb 24 '14 at 11:02

0

use:

var html = [];

for (i = 0; i < 5; i++) {
   html.push('<li></li>');
}

$(".list_container").append( html.join('') );

answered Feb 24 '14 at 11:02

Milind Anantwar

81,290
25
94
125

score 0 · Answer 4 · answered Feb 24 '14 at 11:02

0

Try with the easiest way.

for(var i=1; i <= number_of_items; i++)
{
  $('.list_container').append('<li></li>');
}

answered Feb 24 '14 at 11:02

Bharat soni

2,686
18
27

Awful for the performance. You call jQuery, access the list and call the `append` method `number_of_times` times – Fabrizio Calderan Feb 24 '14 at 11:04

S1cK94 · Answer 5 · 2014-02-24T11:08:53.020

0

A for loop it's the simplest approach:

for(var i = 0; i < number_of_items; i++)
    $('.list_container').append('<li></li>');

By the way, you have a lot of options, for example while loops and array joining.
Take a look to other answers

edited Feb 24 '14 at 11:08

answered Feb 24 '14 at 11:03

S1cK94

43
7

It's not best approach because your are calling here `append()` method for each number_of_items. Better would be to call it only once ;) – A. Wolff Feb 24 '14 at 11:04

Append same number of as the value of variable

5 Answers5

Append same number of
as the value of variable