jquery add class to parent

Question

I need to build dropdown menu on bootstrap but i don't have option to change manualy classes on <ul> and <li> elements, i got them from cms and have to add classes to elements i know how to change class but don`t know how to add class element something like this:

add class 'some class' to 'li' where 5 child is ul
add class 'some class' to 'a' where parent has 'some class'
add attribute 'some attr' to 'a' where parent had 'some class'
add class 'some class' to 'ul' where parent is li

Just like i sad here is the code.

<div class="navbar-collapse collapse">
<ul class="nav navbar-nav">
    <li class="menuElement menuElementN1 menuElement_1_1 menuElementFirst">
        <a class="menuElement menuElementN1 menuElement_1_1 menuElementFirst" href="http://xxx/start.html"><span class="menuElementLinkBefore"></span><span class="menuElementLink">Start</span><span class="menuElementLinkAfter"></span></a>              
    </li>
    <li class="menuElement menuElementN1 menuElement_1_6 active"> <----- nedd to add here class 'dropdown'
        <a class="menuElement menuElementN1 menuElement_1_6 menuElementSelected" href="#"> <--- here i need    data-toggle="dropdown"   and class 'dropdown-toggle' <span class="menuElementLinkBefore"></span><span class="menuElementLink">Pages</span><span class="menuElementLinkAfter"></span></a>     
        <ul>  <--- need to add here     class="dropdown-menu"
            <li class="menuElement menuElementN2 menuElement_2_1">
                <a class="menuElement menuElementN2 menuElement_2_1" href="http://xxx/page1.html"><span class="menuElementLinkBefore"></span><span class="menuElementLink">Page 1/span><span class="menuElementLinkAfter"></span></a>
            </li>
            <li class="menuElement menuElementN2 menuElement_2_2">
                <a class="menuElement menuElementN2 menuElement_2_2" href="http://xxx/page2.html"><span class="menuElementLinkBefore"></span><span class="menuElementLink">Page 2</span><span class="menuElementLinkAfter"></span></a>
            </li>
            <li class="menuElement menuElementN2 menuElement_2_3">
                <a class="menuElement menuElementN2 menuElement_2_3" href="http://xxx/page3.html"><span class="menuElementLinkBefore"></span><span class="menuElementLink">Page 3</span><span class="menuElementLinkAfter"></span></a>      
            </li>
        </ul>
    </li>
</ul>
</div>

Answer 1

Try

jQuery(function ($) {
    var $lis = $('.menuElement').has('ul').addClass('dropdown');
    $lis.children('a').addClass('dropdown-toggle').attr('data-toggle',"dropdown").dropdown();
    $lis.children('ul').addClass('dropdown-menu');
});

Demo: Fiddle

Answer 2

This will add id and class in your Ul

$('.menuElement_1_6 > ul').addClass('yourClassname').attr('id', 'yourId');

Answer 3

$('.navbar-collapse.collapse > ul > li:eq(1):has(ul)').addClass('dropdown')
    .children('a').addClass('dropdown-toggle').attr('data-toggle', "dropdown")
    .next('ul').addClass('dropdown-menu');

Answer 4

Try this:

$('.nav').find('li.active').addClass('dropdown'); 
// add the class to active li
$('li.active').find('a').attr('data-toggle', 'dropdown') // add attr to <a>
                        .addClass('dropdown-toggle'); // add the class to <a>
$('li.active').find('ul').addClass('dropdown-menu'); 
// find the ul in active li and add the class

---

Target the .active class on li and do the manipulation as above, yet i want to know when you want to do this stuff on pageload or onclick of any dom node.