title: Bootstrap modal with content cant be opened twice
body: <p>Just starting out so please bear with me :)</p>
  
  <p>I have searched all over this site for answers but I could not find one that matched my problem.</p>
  
  <p>I'm trying to open a bootstrap modal and get some content for it using the jQuery ajax form plugin. It works and the content is showed in the modal, however, when I close the modal and open it again, the screen just flickers and gets grey (backdrop opens) and then it goes back.</p>
  
  <p>If I reload the site and try again, it works until I try to open the same modal again. 
  But if I skip loading content to the modal it opens / closes fine as many times as I want. So I think it has something to do with the old content being there when opening it again. Sometimes the content changes so I need to wipe the old ones from the modal div, but I cant seem to get it to work.</p>
  
  <p>Standard modal div:
  </p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;link rel="stylesheet" href="css/bootstrap-custom.css"&gt;
  &lt;link rel="stylesheet" href="css/bootstrap-theme.min.css"&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
  &lt;script src="http://malsup.github.com/jquery.form.js"&gt;&lt;/script&gt;
  
  &lt;div class="modal fade" id="myModal" role="dialog"&gt;
  &lt;div class="modal-dialog"&gt;
  
    &lt;div class="modal-content"&gt;
      &lt;div class="modal-header"&gt;
        &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Lukk&lt;/button&gt;
      &lt;/div&gt;
      &lt;div class="modal-body"&gt;
          &lt;div class="something" style="display:none;"&gt;
          &lt;/div&gt;          
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>Button used to open the modal:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;button type="button" class="btn btn-primary push" id="1" data-toggle="modal" data-target="#myModal"&gt;Button&lt;/button&gt;
  </code></pre>
  
  <p>And finally, the script to fill the modal with content:</p>
  
  <pre class="lang-js prettyprint-override"><code>$(document).ready(function(){
     $('.push').click(function(){
        var id = $(this).attr('id');
        $.ajax({
           type : 'post',
           url : 'target.php', 
           data :  {'id': id}, 
  
           success : function(r)
          {     
            //show modal
            $('#myModal').modal('show') 
            $('.something').show().html(r); //Show the content in the modal div            
  
         } //Success push
      });//.ajax
  
  }); //push
  
     //Trying to close modal and delete content
     $("#myModal").on('hidden.bs.modal', function () {
        $('#myModal').removeData('bs.modal')
        $(this).data('bs.modal', null);
      }); //myModal hidden
  
  });//document ready
  </code></pre>
  
  <p>As mentioned, this works once. But upon closing the modal and opening again it fails. </p>