CODEWITHSUNDEEP
jqueryhtml
deen justin
deen justin

Reputation: 33

Jquery Tree list

I can add first tree list. But it does not work in next step. How can do it? I want to make tree larger.

$(".thisadd").click(function(){   
   
      $(this).closest("li").append("<ul><li'><a href='#'>Company Maintenance<button class='thisadd'>+</button></a></li></ul>");
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

  <ul id="tree2">
                                      <li data-id="1"><a href="#">TECH</a> <button class="thisadd">+</button><li>
                                      </ul>

Upvotes: 3

Views: 124

Answers (1)

Ahmed Ali
Ahmed Ali

Reputation: 1966

You are calling event on first method but not on dynamically generated buttons. Use .on() for this.

$(document).on("click", '.thisadd', function() {
      $(this).closest("li").append("<ul><li><a href='#'>Company Maintenance</a><button class='thisadd'>+</button></li></ul>");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

  <ul id="tree2">
     <li data-id="1"><a href="#">TECH</a>
      <button class="thisadd">+</button>
     <li>
</ul>

Upvotes: 2

Related Questions