title: success or error message input javascript bootstrap
body: <p>Is there a way to change my input in order to display a succes or error icon at the input? like : <a href="http://getbootstrap.com/css/#forms-control-validation" rel="nofollow">http://getbootstrap.com/css/#forms-control-validation</a> 
  <br>Much appreciated. 
  <br>and here's my code :</p>
  
  <pre><code>&lt;script&gt;
      $(document).ready(function () {
          $('input[name=subdomain]').keyup(subdomain_check);
      });
  
      function subdomain_check() {
          var subdomain = $('input[name=subdomain]').val();
          if (subdomain == "") {
              $('input[name=subdomain]');
          } else {
              jQuery.ajax({
                  type: "POST",
                  url: "ajax.php",
                  data: 'subdomain=' + subdomain,
                  cache: false,
                  success: function (response) {
                      if (response == 1) {
                          $('input[name=subdomain]').html("The URL already exist!");
                      } else {
                          $('input[name=subdomain]').html("The URL is Valid!");
                      }
                  }
              });
          }
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>The HTML code :</p>
  
  <pre><code>    &lt;div class="form-group"&gt;
          &lt;label class="control-label col-md-3" for="install-element-6"&gt;
              &lt;span class="required"&gt;* &lt;/span&gt;subdomain&lt;/label&gt;
      &lt;div class="col-md-6"&gt; //&lt;----- I want it here
          &lt;input type="text" class="form-control input-md col-md-6" name="subdomain" placeholder required id="install-element-6"/&gt; // the method.addClass add it here
      &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>Much appreciated. </p>