Replacing <br /> with \n
<p>I am playing around with this page: <a href="http://www.problemio.com/problems/problem.php?problem_id=228" rel="nofollow">http://www.problemio.com/problems/problem.php?problem_id=228</a></p>

<p>To reproduce the problem, log in with this: testing@problemio.com / testing</p>

<p>Then click on the "comments" tab and click on edit wherever you see that option inside the edits tab. You will see that the <code>&lt;br /&gt;</code> are still there, but to create that edit form, here is the JavaScript I use to make the html for that form:</p>

<pre><code>// Edit comment
$('.edit_comment').live('click' , function() 
{
    // Showing the wait image
    $("#loading").show();

    var problem_id = $(this).attr("data-problem_id");
    var problem_comment_id = $(this).attr("data-problem_comment_id");  
    var problem_comment_text = $(this).attr("data-problem_text");

    // problem_comment_text_'.$problem_comment_id.'
    var div_name = "problem_comment_text_" + problem_comment_id;
        //var dataString = 'problem_id='+ problem_id + '&amp;problem_comment_id=' + problem_comment_id;

    // Now validate the input
        if( problem_id == '' || problem_comment_id == '' )
        {
       //$('#add_message_success').fadeIn(200).hide();
        //$('#add_message_error').fadeOut(200).show();          
        }
        else
        {   
            // Check if the person is logged in.
            // Now check if the person is logged in.
        $.ajax({
                type: "POST",
                url: "/auth/check_login.php",
                dataType: "json",
                success: function(data)
                {
                    $("#loading").hide();

                    // 1) close that piece of HTML
                    $("#" + div_name).hide();  // Works

                    problem_comment_text = problem_comment_text.replace(/\n/g,"&lt;br /&gt;");

                // 2) Make an HTML form and display it in that piece of HTML
                var new_comment_form = "&lt;form id='add_comment' method='post'&gt;&lt;textarea name='problem_comment' cols=60 rows=6 id='problem_comment'&gt;" + problem_comment_text + "&lt;/textarea&gt;&lt;input type='hidden' id='problem_id' name='problem_id' value='" + problem_id + "' /&gt;&lt;input type='hidden' id='problem_comment_id' value='" + problem_comment_id + "' /&gt;&lt;input type='submit' class='button' value='Edit Message' /&gt;&lt;input type='button' class='button' id='cancel_comment' data-problem_id='" + problem_id + "' value='Cancel' /&gt;&lt;/form&gt;";

                // Now replace the current form with the crap I made above.
                $("#" + div_name).html( new_comment_form );  // Works
                $("#" + div_name).show(  );  // Works

                // 3) Hide the other text area form.
                $("#comment_bottom_text").hide(); // TODO - MAKE THIS WORK
                $(".comment_form").hide();                                              
            },
            error: function(json) // Error for checking if user is logged in.
            {
                // Showing the wait image
                $("#loading").hide();                    

                $("#loginpopup").dialog();

                return false;           
            }
    });
    }         

 return false;
});     
</code></pre>

<p>So you see I try to replace the <code>&lt;br /&gt;</code> with <code>\n</code> and it kind of works, but if you do the same thing again with the same comment, it places <code>&lt;/a&gt;</code> tag in there.  Any idea why that happens and how to stop it? Its weird because it happens on the second time editing a comment and not the first.</p>
