jquery submenu show on all li's

Question

I try to get the submenu only on the li's witch it contents. i'm a little bit clueless how to get this working maybe someone can help me with this?

This build in a Drupal7 website with bootstrap theme.

see jquery:

/* scroll menu li "based on block" */
var newsLinks = '<ul id="sidebar" class="nav nav-stacked">';
var submenu = '<ul class="nav nav-stacked">';

$("#content .block-block").each(function (index, item) {

    $(this).find('.sub').each(function () {
        var submenu_id = $(this).attr('id');
        submenu += '<li><a href="#' + submenu_id + '">' + submenu_id + '</a></li>';
    })
    submenu += '</ul>';

    newsLinks += '<li class="' + item.id + '"><a href="#' + item.id + '">' + item.id + '</a>' + submenu + '</li>';
});
newsLinks += '</ul>';

$(".bs-docs-sidebar").html(newsLinks);

Answer 1

Yesterday, i got it working with the autoanchore js. I will make a fiddle to show what if done so maybe it can help other people. thanks for your time!

[fiddle link][1]


  [1]: https://jsfiddle.net/wcammeraat/rw55b54n