title: set select option 'selected' in a modal bootstrap
body: <p>I have a select field and I have to select one of those options with jQuery. I have this method, and it works for me anywhere, except in a modal.<br>
  When I open my target page, it opens a modal automatically with a select field which I am trying to set his selected item.</p>
  
  <p>I have the following HTML:</p>
  
  <pre><code>&lt;div class='modal small fade' id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              &lt;form method="post" action="UpdateMPrev" &gt;
                  &lt;select id="echelle"  name="echelle" class="form-control"&gt;                     
                      &lt;option value="mensuelle"&gt; Mensuelle&lt;/option&gt;  
                      &lt;option value="trimestrielle"&gt;Trimestrielle&lt;/option&gt; 
                      &lt;option value="semestrielle" &gt; Semestrielle&lt;/option&gt; 
                      &lt;option value="annuelle" &gt; Annuelle&lt;/option&gt; 
                      &lt;option value="aucun"&gt; Aucun&lt;/option&gt; 
                  &lt;/select&gt;
                  &lt;input type="submit"/&gt;
              &lt;/form&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt; 
  </code></pre>
  
  <p>then directly I have this script:</p>
  
  <pre><code>&lt;script&gt;
      var echelle= document.getElementById('echelle');
      echelle.value = 'trimestrielle';
  &lt;/script&gt;
  </code></pre>
  
  <p>The same code, at the same page works, only if I put the select field in the main page, I mean not in the modal, can any one help?</p>