Question

Basically I am trying to have jQuery replace the button with the form and status div once clicked.

I am new to jQuery and hardly an advanced programmer so I am sure the solution will be relatively simple. On the other hand I am at my wits end with this issue and any help would be greatly appreciated. Thank you.

EDIT: Solution found. Interestingly enough it also only worked when I put it in a separate .js file and referenced it, not when I had it within tags on the php page. Thanks again to everyone who responded!

---

$(document).ready(function() { 
   $("#repbutton").click(function() {
   $("#repbutton").replaceWith("<form id=\"reputation_form\" method=\"post\">
    Give positive reputation to <?=$reply_user['username']?> for their reply?
    Comment: <input type=\"text\" name=\"comment\" id=\"comment\" /> 
             <input type=\"hidden\" id=\"uid\" value=\"<?=$reply_user['id']?>\">
             <input type=\"hidden\" id=\"rid\" value=\"<?=$replies_row['id']?>\">
             <input type=\"hidden\" id=\"urid\" value=\"<?=$user_row['id']?>\">
             <input type=\"submit\" value=\"Give Reputation\" />
</form>
<div id=\"status\">
        <p></p>
    </div>"); 

    });
   });

Answer 1

Newlines aren’t valid inside string literals unless you escape them with \. Simply put, either compress the string to one line or add \ to the end of each line:

$(document).ready(function() { 
   $("#repbutton").click(function() {
   $("#repbutton").replaceWith("<form id=\"reputation_form\" method=\"post\">\
    Give positive reputation to <?=$reply_user['username']?> for their reply?\
    Comment: <input type=\"text\" name=\"comment\" id=\"comment\" /> \
             <input type=\"hidden\" id=\"uid\" value=\"<?=$reply_user['id']?>\">\
             <input type=\"hidden\" id=\"rid\" value=\"<?=$replies_row['id']?>\">\
             <input type=\"hidden\" id=\"urid\" value=\"<?=$user_row['id']?>\">\
             <input type=\"submit\" value=\"Give Reputation\" />\
</form>\
<div id=\"status\">\
        <p></p>\
    </div>");

    });
});​

Working example – http://jsfiddle.net/rd4w9/