1. <div class="modal fade" id="selectLanguageConfirmModal">
       <div class="modal-dialog">
           <div class="modal-content">
   
               <div class="modal-header">
                   <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                   <h3>Select Language</h3>
               </div>
               <div class="modal-body">
                   <p>Are you sure you want to do this?</p>
               </div>
               <div class="modal-footer">
                   <button class="btn btn-gray" data-dismiss="modal" aria-hidden="true">No! Don't Change It!</button>
                   <button class="btn btn-danger" id="selectLanguageBtn">Yes.</button>
               </div>
           </div>
       </div>
   </div>

I want to show this popup modal when select an item from a drop down menu. After that I can click the button do something.

1. $("#Selected").change(function () {
                   var selectedValue = $(this).find('option:selected').text();
                   localStorage.setItem("selectedLanguageName", selectedValue);
                   $("#selectLanguageConfirmModal").show();
               });
   
               $("#selectLanguageBtn").on("click", function () {
                   $("#selectLanguageConfirmModal").hide();
                   window.location.href = "blah blah";
               });
   

My question is that the button click event is reached automatically when page loads. I don't want it. I want to click it manually when pop up modal shows.