Creating a unordered list items

[ghost]

I have a handlebar html

<ul><li>{{#listConstruct product}}{{this}}{{/listConstruct}}</li></ul>

Need to have output like this

<ul>
<li>Pen</li>
<li>Pencil</li>
<li>Notebook</li>
</ul>

I wrote a listConstruct helper like this.

Handlebars.registerHelper('listConstruct', function(items) {
   let res = '';
    items.forEach((val)=>{res+= '<li>'+val+'</li>'});
   return res;
 });

But this result in output like this

<ul><li><li>Pen</li><li>Pencil</li><li>Notebook</li></li></ul>

How to remove the extra li inside of UL.