xyzdata/dynamically-generate-nested-li.md

## dynamically-generate-nested-li.md

      
    Raw
  

              dynamically-generate-nested-li.md
            
          
    how to dynamically generate nested li list using js

    
//
https://stackoverflow.com/questions/19363972/create-nested-lists-from-a-dynamically-created-single-list
jquery wrap & wrapall & wrapinner

https://api.jquery.com/wrap/
https://api.jquery.com/wrapall/
https://api.jquery.com/wrapinner/

Wrap an HTML structure around each element in the set of matched elements.

在一组匹配的元素中的每个元素周围包装一个HTML结构。
<div class="container">
    <div class="inner">Hello</div>
    <div class="inner">Goodbye</div>
</div>
.wrap( wrappingElement )

$( ".inner" ).wrap( "<div class='new'></div>" );
<div class="container">
    <div class="new">
        <div class="inner">Hello</div>
    </div>
    <div class="new">
        <div class="inner">Goodbye</div>
    </div>
</div>

.wrap( function )

$( ".inner" ).wrap(function() {
    return "<div class='" + $( this ).text() + "'></div>";
});
<div class="container">
    <div class="Hello">
        <div class="inner">Hello</div>
    </div>
    <div class="Goodbye">
        <div class="inner">Goodbye</div>
    </div>
</div>