john
john

Reputation: 567

how to add a div before the ul tag

I am using wordpress and i want to add two divs before the sub-menu part ul tag .My code is like this .

<ul class='main_ul'>
    <li>link 1</li>
    <li class='has_submenu'>link2</li>
    <ul>
        <li>link</li>
        <li>link</li>
    </ul>
    </li>
</ul>

i want like this

<ul class='main_ul'>
    <li>link 1</li>
    <li class='has_submenu'>link2</li>
    <div class='scrol'>
        <div class='overview'>
            <ul>
                <li>link</li>
                <li>link</li>
            </ul>
        </div>
    </div>
    </li>
</ul>

how this is possible with jQuery or wordpress?? thanx in advance

Upvotes: 0

Views: 1686

Answers (3)

Umesh Sehta
Umesh Sehta

Reputation: 10683

You can use jQuery wrap function:-

$(function(){
  $('.main_ul ul').wrap('<div class="overview"/>').wrap('<div class="scrol"/>');
});

or

$(function(){
     $('.main_ul ul').wrap('<div class="scrol"><div class="overview"></div></div>');
});

Demo

Upvotes: 1

4dgaurav
4dgaurav

Reputation: 11496

Demo

jquery

$("ul.main_ul ul:eq(0)").wrap('<div class="scrol"><div class="overview"></div></div>');

This gets ul of index 0, then wraps it. It will help if you have multiple ul in your .mail_ul

Upvotes: 0

ssut
ssut

Reputation: 441

Best way is edit the template file.

You can do this using jQuery.wrap() function:

$('ul.main_ul ul').wrap('<div class="scrol"><div class="overview"></div></div>');

take a look documentation: http://api.jquery.com/wrap/

Upvotes: 0

Related Questions