title: How to change bootstrap modal body content dynamically
body: <p>I created a bootstrap modal, I am looking for possible solution to make my modal content change dynamically.. here is my modal </p>
  
  <pre><code>&lt;div class="modal fade" id="signupmodal"&gt;
        &lt;div class="modal-dialog"&gt;
        &lt;div class="modal-content"&gt;
            &lt;div class="modal-header"&gt;
                &lt;h4&gt;Sign up or log in&lt;/h4&gt;
            &lt;/div&gt;
            &lt;div class="modal-body"&gt;
                &lt;a class="btn btn-block btn-social btn-facebook btn-lg"&gt;
                &lt;i class="fa fa-facebook"&gt;&lt;/i&gt; Sign in with Facebook
                &lt;/a&gt;
            &lt;h4 style="text-align:center;"&gt;&lt;b&gt;OR&lt;/b&gt;&lt;/h4&gt;
               &lt;a class="btn btn-success btn-lg btn-block" data-toggle="modal" data-target="#loginmodal"&gt;LOG IN&lt;/a&gt;
               &lt;a type="button" class="btn btn-link btn-md" data-toggle="modal" &gt;Create Account&lt;/a&gt;
            &lt;/div&gt;
            &lt;div class="modal-footer"&gt;
                &lt;button type="button" class="btn btn-danger btn-sm" data-dismiss="modal"&gt;&lt;b&gt;Close&lt;/b&gt;&lt;/button&gt;
            &lt;/div&gt;
            &lt;/div&gt;&lt;!--modalcontent--&gt;
        &lt;/div&gt;&lt;!--modaldialog--&gt;
    &lt;/div&gt;&lt;!--modalfade --&gt;`
  </code></pre>
  
  <p>when i click the log in button i want to change my modal-body content to this login form </p>
  
  <pre><code> &lt;form&gt;
      &lt;div class="form-group"&gt;
         &lt;label for="inputEmail"&gt;Email / Username&lt;/label&gt;
         &lt;input class = "form-control" type="email"       id="inputEmail"placeholder="Email"&gt;
       &lt;/div&gt;
      &lt;div class="form-group"&gt;
         &lt;label for="inputPassword"&gt;Password&lt;/label&gt;
         &lt;input class = "form-control" type="password" id="inputPassword" placeholder="Password"&gt;
         &lt;a type="button" class="btn btn-link btn-sm"&gt;Forgot password&lt;/a&gt;
       &lt;/div&gt;
      &lt;div class="form-group"&gt;
          &lt;a type="button" class="btn btn-info btn-md"&gt;Log in&lt;/a&gt;
        &lt;/div&gt;
    &lt;/form&gt;
  </code></pre>
  
  <p>THANK YOU SO MUCH!</p>