Using JSF form fields with jQuery – Can’t use jQuery with : (colon) problem

if you have a jsf page of the following

<h:form id="frmRegistration">
<h:panelGrid columns="2" rules="rows">
<h:outputLabel id="lblFirstName" value="First Name"  />
<h:inputText id="txtFirstName" value="#{}" label="First Name" required="true"/>

And say you want assign default value from javascript to the text box you would use:

    $("#frmRegistration:txtFirstName").val("this val");

Since that is how JSF would generate the id of the component
But, you wont see any effect as jQuery don’ like the generated colon (:).
use this instead> ‘escape it’

    $("#frmRegistration\:txtFirstName").val("this val");