Show dynamic nested dropdown lists in bootstrap
<p>I am new to this so please bear with me ..</p>

<p>I have tried different solutions but i don't to get what I need working right. My list of data is read from a JSON file with this code </p>

<pre><code>function showInsatserList() {
    var promise = [];
    promise = getSelectedSubareaInsatslist();
    promise.done(function (insatserlist) {
        $('#dropdownmenu li').remove();
        for (var i in insatserlist) {
            $('#dropdownmenu').append('&lt;li class="dropdown-submenu"&gt;&lt;a href="#"&gt;' + insatserlist[i].title + '&lt;/a&gt; '
                + '&lt;ul class="dropdown-menu"&gt;&lt;li&gt;HEJ&lt;/li&gt;&lt;/ul&gt;&lt;/li&gt;');
        }
    });
}
</code></pre>

<p>and then i show it using this ..</p>

<pre><code>$('.insatsDropdown').on('click', function (e) {
    showInsatserList();
});
</code></pre>

<p>now my html look like this ... </p>

<pre><code>  &lt;div class="dropdown insatsDropdown"&gt;
      &lt;a href="#" class="btn dropdown-toggle" data-toggle="dropdown"&gt;Välj insatser &lt;span class="caret"&gt;&lt;/span&gt;&lt;/a&gt;
      &lt;ul id="dropdownmenu" class="dropdown-menu"&gt;&lt;/ul&gt;
  &lt;/div&gt;
</code></pre>

<p>What i want to do is that when i click on any of the li from the dropdown menu, it would show only the underlying submenu which at the moment is populated with just a randowm word in swedish "HEJ". </p>

<p>I tried standard click methods but the only thing that would work on dynamic content seems to be by using this line of code below ..</p>

<pre><code>$(document).on('click', '.dropdown-submenu', function (e) {
    $(this).find('ul').toggle(); //not working
});
</code></pre>

<p>the problem is that .. what i do inside does not really toggle anything </p>

<p>my fiddle is here : </p>

<p><a href="https://jsfiddle.net/MissKalani/yvrL24Lv/9/" rel="nofollow">https://jsfiddle.net/MissKalani/yvrL24Lv/9/</a></p>

<p>What i want to do there now is that.. for example.. i click on one of the li.. like "Volvo".. it would show the underlying ul element.</p>

<p>I am open to different approaches too. I tried adding the ul element also when clicking but that does not work either yet for me. </p>