Question

I have following html and want to wrap with javascript or jquery a div around all li’s (its not definied how many li’s there are)

<div class='example1'>
  <div class='example2'>
  <h1>Test</h1>
  <div class='example3'>
  <li></li>
  <li></li>
  ...
  <li></li>
  <li></li> 
</div>

The Result should look like

<div class='example1'>
  <div class='example2'>
  <h1>Test</h1>
  <div class='example3'>
  <div class='lis'>
    <li></li>
    <li></li>
    ...
    <li></li>
    <li></li>
  </div>    
</div>

I’m not able to add anything else the existing html 🙁

Can you please help me?

Answer 1

You could use wrapAll :

$('li').wrapAll('<div class=lis></div>');

But the HTML norm specifies that LI elements are only permitted in UL, OL and MENU, not DIV.

Demonstration