expand the submenu based on active url : 

<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-css -->

     .menu-sidebar .child-ul {display:none;}

<!-- language: lang-html -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <ul class="menu-sidebar">
                <li class="parent-li"><a href="A.html">A</a>
                    <ul class="child-ul">
                        <li><a href="../1.html">1</a></li>
                        <li><a href="../2.html">2</a></li>
                        <li><a href="3.html">3</a></li>
                        <li><a href="../4.html" >4</a></li>
                        <li><a href="../5.html" >5</a></li>
                        <li><a href="../6.html">6</a></li>
                     </ul>
                 </li>
                 <li class="parent-li"><a href="B.html">B</a>
                    <ul class="child-ul">
                       <li><a href="11.html">1</a></li>
                       <li><a href="12.html" >2</a></li>
                       <li><a href="13.html" >3</a></li>
                       <li><a href="14.html" >4</a></li>
                       <li><a href="15.html" >5</a></li>
                       <li><a href="16.html" >6</a></li>
                       <li><a href="17.html" >7</a></li>
                       <li><a href="18.html" >8</a></li>
                       <li><a href="19.html" >9</a></li>
                       <li><a href="20.html" >10</a></li>
                       <li><a href="21.html" >11</a></li>
                   </ul>
               </li>
               <li class="parent-li"><a href="C.html">C</a>
                   <ul class="child-ul">
                      <li><a href="21.html">1</a>
                      </li>
                      <li><a href="22.html" >2</a>
                      </li>
                      <li><a href="23.html" >3</a>
                      </li>
                      <li><a href="24.html" >4</a>
                      </li>
                      <li><a href="25.html" >5</a>
                      </li>
                      <li><a href="26.html">6</a>
                      </li>
                      <li><a href="27.html" >7</a>
                      </li>
                      <li><a href="28.html" >8</a>
                      </li>
                      <li><a href="29.html" >9</a>
                      </li>
                  </ul>
               </li>
             </ul>

<!-- end snippet -->

I have a sidebar list which having submenu. each list has link to different page.i want the submenu to expand on 2 condition
1-when its parent link is active only its children should expand.
2-when any of the child of particular list is active 
expand the submenu of a list based on active url.

.[enter image description here][1]


  [1]: https://i.stack.imgur.com/kkCmr.png