How to wrap all `ul` elements in `div` with JQuery automatically?

Question

How to wrap all ul elements in div with JQuery automatically?

<div id="my_uls">
  <ul>
   <li>Item one</li>
   <li>Item two
       <ul>
          <li>Item one of two</li> 
      </ul>
   </li>
  </ul>
</div>

But what I want:

<div id="my_uls">
   <div>
    <ul>
       <li>Item one</li>
       <li>Item two
           <div>
               <ul>
                  <li>Item one of two</li> 
              </ul>
          </div>
       </li>
    </ul>
  </div>
</div>

Answer 1

You need to use .wrap() :

 $(function() { $("ul").wrap("<div />"); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="my_uls"> <ul> <li>Item one</li> <li>Item two <ul> <li>Item one of two</li> </ul> </li> </ul> </div> 

Answer 2

Just use wrap function for this

<scrpt>
      $(document).ready(function(){
        var myuls = $("#my_uls").find("ul");
        for(var i=0;i<myuls.length;i++){
            $(myuls[i]).wrap("<div></div>");
        }
      });
   </script>

Answer 3

$('#my_uls ul') , This will refer all your ul inside the div .

if you need the 1st ul only

$('#my_uls ul:not(#my_uls ul ul)') .