The opened < ul> element not collapse on click the <li> which do not have child <ul>.and also want to add active class to the <li> to those which do not have child<ul>

[reason706]

Actually what i want is to collapse the opened submenu while clicking the <li> element which do not have sub menu like the first one in the below example . and also want to add active to this <li> .

<ul id="metismenu"> 
// this li tag don't have submenu 

    <li>
         <a class="" href="#" aria-expanded="true">Menu 1</a>
        </li>

        <li class="">
         <a class="has-arrow" href="#" aria-expanded="true">Menu 1</a>
         <ul>
         ...
         </ul>
        </li>
        <li>
         <a class="has-arrow" href="#" aria-expanded="false">Menu 2</a>
        <ul>
         ...
         </ul>
        </li>
        ...
 </ul>