jquerynested-setsnested-set-model

jquery add new li to nested set model


What is the best way to insert a new li element into a specific position of a nested set model?

For example, the following list:

<ol class="nested">
    <li id="list_1"></li>
    <li id="list_2">
        <ol>
            <li id="list_3"></li>
            <li id="list_4"></li>
        </ol>
    </li>
    <li id="list_5"></li>
</ol>

Let's say I want to insert a new li as a child of #list_2 I can do like that:

$('#list_'+parent_ID+' ol > li:last-child').after('<li id=""></li>');

But wouldn't work if parent was going to be #list_1 or #list_4 Any ideas !?


Solution

  • There are many ways. One may be this:

    if ($('#list_'+parent_ID+' ol').length > 0) {
      $('#list_'+parent_ID+' ol > li:last-child').after('<li id=""></li>');
    } else {
      $('#list_'+parent_ID).append('<ol><li id=""></li></ol>');
    }
    

    You can test here.