title: Insert blank space between two words in html
body: <p>I wan to insert some spaces in between two words and I do not want to use <code>pre</code> tags. In my code here is one input field where user can enter text and some javascript code display it in <code>div</code> you can check the code right below.</p>
  
  <pre><code>&lt;input type="text" id="user-input" /&gt;
  
  &lt;div id="user-text"&gt;&lt;/div&gt;
  </code></pre>
  
  <p><strong>Javascript code</strong>  </p>
  
  <pre><code>    $(document).on('keyup', '#user-input', function(event){
  var userText = $('#user-text');
  var clientText = $(this).val().toUpperCase();
  if(event.keyCode === 32 || event.which === 32){ clientText += '&amp;nbsp;';  }
      clientText = $('&lt;textarea /&gt;').html(clientText).text();
  
      userText.text(clientText);
  });
  </code></pre>
  
  <p>I'm using <code>&amp;nbsp;</code> for inserting space between two words but this is not working. It only insert one space if I want to insert ten space then what.
  The code is not working like as I'm expecting you can't able to insert more than one space using this code.</p>
  
  <p><strong>UPDATE</strong><br>
  I want like this.</p>
  
  <p><a href="https://i.stack.imgur.com/N88s6.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/N88s6.png" alt="enter image description here"></a></p>