In this article I will explain with an example, how to display (copy) TextBox value to Label using jQuery in HTML.
When the Copy Button is clicked, the value of the TextBox is assigned to the Label using jQuery in HTML.
 
 
HTML Markup
The following HTML Markup consists of an HTML TextBox, a Button and a Label element.
<input type="text" id="txtName"/>
<input type="button" id = "btnCopy" value="Copy To Label"/>
<hr />
<label id = "lblName"></label>
 
 
Displaying (Copying) TextBox value to Label using jQuery
Inside the jQuery document ready event handler, the Copy Button has been assigned a jQuery Click event handler.
When the Copy Button is clicked, first the TextBox and then the Label elements are referenced and then the value of the TextBox is assigned to the Label element using jQuery.
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#btnCopy").click(function () {
            //Reference the TextBox.
            var txtName = $("#txtName");
 
            //Reference the Label.
            var lblName = $("#lblName");
 
            //Copy the TextBox value to Label.
            lblName.html(txtName.val());
        });
    });
</script>
 
 
Screenshot
Display (Copy) TextBox value to Label using jQuery
 
 
Browser Compatibility

The above code has been tested in the following browsers.

Internet Explorer  FireFox  Chrome  Safari  Opera 

* All browser logos displayed above are property of their respective owners.

 
 
Demo
View Demo
 
 
Downloads
Download Code