javascript - jquery .append trims the spaces automatically -


i trying append new data container div using jquery .append() function. but, output appended trims spaces between labels created. check screenshot attached:enter image description here

how can fix issue?

javascript , html code given below:

$("a.add-member").click(function(){    var user = '<div class="row user">'+        '<div class="col-md-6">abc@site.com</div>'+        '<div class="col-md-4">'+        '<div class="user-roles">'+        '<span class="label label-user-role">role 1</span>'+        '<span class="label label-user-role">role 2</span>'+        '<span class="label label-user-role active">role 3</span>'+        '</div>'+        '</div>'+        '<div class="col-md-2 text-center">'+        '<a href="#" class="remove-member"><i class="fa fa-times-circle-o"></i></a>'+        '</div>'+        '</div>';    $("#add-team .users").append(user).hide(0).fadein(700);  });
<div class="users">    <div class="row user">      <div class="col-md-6">xyz@site.com</div>      <div class="col-md-4">        <div class="user-roles">          <span class="label label-user-role">role 1</span>          <span class="label label-user-role">role 2</span>          <span class="label label-user-role active">role 3</span>        </div>      </div>      <div class="col-md-2 text-center">        <a href="#" class="remove-member"><i class="fa fa-times-circle-o"></i></a>      </div>    </div>    <div class="row user">      <div class="col-md-6">pqr@site.com</div>      <div class="col-md-4">        <div class="user-roles">          <span class="label label-user-role">role 1</span>          <span class="label label-user-role">role 2</span>          <span class="label label-user-role active">role 3</span>        </div>      </div>      <div class="col-md-2 text-center">        <a href="#" class="remove-member"><i class="fa fa-times-circle-o"></i></a>      </div>    </div>  </div>

added spaces in jquery code:

$("a.add-member").click(function(){     var user = '<div class="row user">'+                     '<div class="col-md-6">ajinkya.bandagale@gmail.com</div>'+                     '<div class="col-md-4">'+                         '<div class="user-roles">'+                             '<span class="label label-user-role">admin</span> '+                             '<span class="label label-user-role">observer</span> '+                             '<span class="label label-user-role active">normal</span> '+                         '</div>'+                     '</div>'+                     '<div class="col-md-2 text-center">'+                         '<a href="#" class="remove-member"><i class="fa fa-times-circle-o"></i></a>'+                     '</div>'+                 '</div>';     $("#add-team .users").append(user).hide(0).fadein(700); }) 

Comments

Popular posts from this blog

Magento/PHP - Get phones on all members in a customer group -

php - .htaccess mod_rewrite for dynamic url which has domain names -

Website Login Issue developed in magento -