dropdown hover with selected value on reload

See more:

jQuery

HI
i use bootstrap dropdown hover with ul and li

i.e.
when i keep mouse on ul ,i get list as dropdown

when i click on li, i want to reload page and keep current li id value as default in ul

the code i use is

<div class="col-12">
                                      <div class="btn-toolbar">
                                        <div class="btn-group">
                                          <button class="btn dropdown-toggle" data-toggle="dropdown" data-hover="dropdown">Sort By <span class="caret"></span></button>
                                          <ul class="dropdown-menu">
                                            <li><a href="#" id="ltoh" onclick="GetSortBy(this);" >Rating Low to High</a></li>
                                            <li><a href="#" id="htol" onclick="GetSortBy(this);">Rating High to Low</a></li>
                                            <li><a href="#" id="prcltoh" onclick="GetSortBy(this);">Price Low to High</a></li>
                                            <li><a href="#" id="prchtol" onclick="GetSortBy(this);" >Price High to Low</a></li>
                                          </ul>
                                        </div>
                                      </div>
                                    </div>

So when page reloads after i click , rating high to low, the sort by must be replaced by Rating High To low and , when again i hover on dropdown, the li for rating high to low must be highlighed..

this is what i want