nan error in load Advertising box inside the li element

Question

i write this code, it's right but show nan error after Advertising img.

Does anyone know where this error comes from and how can I fix it?

my code in html:

<div>
 <ul class="list-groupJournalList">
 </ul>
</div>

my code in jquery:

jQuery(document).ready(function ($) {
    for (var i = 1; i <= 100; i++) {
  

        inner1 = ('<li class= "list-group-item">' +

            '<div class="col-xs-12 article-wrapper">' + '</div>' +

            '</li>');

       
        advboxx = ('<li><div class="advertising-SearchReasultBox">' +
            '<img src="../FrontEnd/media/image/Sid-adv1-moavenatelmi.gif" height="80"/>' +
            +'</div></li>');

        for (k = 1; k < 3; k++) {
        $('.list-groupJournalList').append(inner1);
        }
        $('.list-groupJournalList').append(advboxx);

    }

The output is similar to the image below: nan error in image

Answer 1

I think you forgot to close your function, the "for" loop and there's an extra "+" here at the beginning of the 3rd line :

advboxx = ('<li><div class="advertising-SearchReasultBox">' +
            '<img src="../FrontEnd/media/image/Sid-adv1-moavenatelmi.gif" height="80"/>' +
            +'</div></li>');

Try this :

jQuery(document).ready(function ($) {
     for (var i = 1; i <= 100; i++) {
         inner1 = '<li class= "list-group-item"> <div class="col-xs-12 article-wrapper"> </div> </li>';
         advboxx = '<li><div class="advertising-SearchReasultBox"> <img src="../FrontEnd/media/image/Sid-adv1-moavenatelmi.gif" height="80"/> </div> </li>';

         for (k = 1; k < 3; k++) {
            $('.list-groupJournalList').append(inner1);
         }
         $('.list-groupJournalList').append(advboxx);
     }
});