how to remove/hide ,change caption of input button using javascript?

Question

i have few input buttons . I want to do the following things on response of ajax call:

1)remove input button for that specific button that was clicked initially
2)change background color input textbox from red to green
3)change caption of edit box to try again if ajax call failed  

My current code passes value to function correctly and ajax gets response back correctly but i just dont know how to do the above 3 things !My goal is that user know that data changed correctly by make above three changes in inputboxes. could any one show me how this can be done.Thanks

javascript that get called by pressing inputbox button:

<script>
function setNewValue(a) {
var text = $("#"+a);
var textboxvalue = text.val();

    var url = "./edit.php";
    $.post(url, {
        "method": "post",
        "rowId": a,
        "rowValue": textboxvalue,

    }, function(data) 
       {

          var ajaxResponse = data;

        //alert("success"+ajaxResponse);

            if(ajaxResponse.indexOf("SuccessEdit")>=0)
            {
              //remote the edit button
            } 
            else
            {
              //change caption of edit button to try again

            }

      })
    }

</javascript>

php part that prints the inputboxes in html table:

$table3.="<tr>";
 $table3.="<td>" . $row['ID'] ."(".$totalRows. ")</td>";
 $table3.="<td bgcolor=\"#FF0000\"><input type=\"text\" id =\"". $row['ID'] ."\" name=\"". $row['ID'] ."\" value=\"typer here to edit\"><button onclick='setNewValue(\"".$row['ID']."\")'>Edit this Row</button></td>";
 $table3.="<td>" . $row['imgPURL'] . "</td>";
 $table3.="<td>" . $row['imgUrl'] . "</td>";
 $table3.="<td>".$line."</td>";  echo "</tr>";

Answer 1

1. you are not passing two values to the function
2. adding this to the call gives you the object in the function.

Your code is too messy for me to fix completely but try

var saveBut;
function setNewValue(but,a,b) {
  var saveBut=$(but);
  var url = "./edit.php";
  $.post(url, {
    "method": "post",
    "rowId": a,
    "rowValue": b,

  }, function(data) {
     var ajaxResponse = data;
    //alert("success"+ajaxResponse);
     if(ajaxResponse.indexOf("SuccessEdit")>=0) {
       saveBut.remove();
       saveBut.prevAll('input').addClass("valid");
     }
     else {
      saveBut.html("Try Again")
     }
 })
}

using this php which still does not pass any value to "b"

<button onclick='setNewValue(this,\"".$row['ID']."\")'>

Answer 2

function setNewValue(a,b) {
    var edit_button=this;
    var input_area=$("#"+a);
    var url = "./edit.php";
    $.post(url, {
        "method": "post",
        "rowId": a,
        "rowValue": b,

    }, function(data) 
       {

          var ajaxResponse = data;

        //alert("success"+ajaxResponse);

            if(ajaxResponse.indexOf("SuccessEdit")>=0)
            {
               //remove the edit button
               edit_button.hide();
            } 
            else
            {
              //change caption of edit button to try again
             input_area.val("try again");

            }

      })
    }

</javascript>