title: I want to render my input text value inside <p></p> tag
body: <p>I want to render my input text value inside <code>&lt;p&gt;&lt;/p&gt;</code> tag. I'm able to render input text value to other input, but how can I render that inside <code>&lt;p&gt;&lt;/p&gt;</code> tag?</p>
  
  <p>Work sample: <a href="https://jsfiddle.net/wpmnvbow/" rel="nofollow">https://jsfiddle.net/wpmnvbow/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;input type="text" placeholder="Type PCP Name" class="form-control" id="PCPName"  /&gt;&lt;br /&gt; &lt;br /&gt;
  Selected PCP:
  
  &lt;input id="selectedPCP" disabled="disabled" value="Not Selected" /&gt;
  &lt;!--&lt;p id="selectedPCP"&gt; hey &lt;p&gt;--&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>$('#PCPName').keyup(function(){
    var nameValue = $('#PCPName').val();
      if (nameValue == ""){
          $('#selectedPCP').val('Not Selected');
      }
      else{
      //alert(nameValue);
      $('#selectedPCP').val(nameValue);
      }
  
  });
  $('#PCPName').change(function(){
    var nameValue = $('#PCPName').val();
      if (nameValue == ""){
          $('#selectedPCP').val('Not Selected');
      }
      else{
      //alert(nameValue);
      $('#selectedPCP').val(nameValue);
      }
  });
  </code></pre>