remove element by id after clicked

Question

i have dynamic button, generate from database. Ex:

button 1, id=button1
button 2, id= button2
button 3, id= button3
..etc....

If i click button 1, my function will send something to mysql database, so i call ajax. but i what i want is : how to remove button1 after process send to database is completed ? same thing with other button (send something to database, and remove button)

in my button i put onClick

here is my code :

<script>
    function process(idbutton){
    $.ajax({
                  type: "POST",
                  url: "http://urlofmysite.com/process.php?",
                 data: "pidd=" + idbutton,
                  cache: false,
                  success: function(html){
                    alert(html); //RESPONSE FROM SERVER      
                  }
                }); 
    //REMOVING BUTTON
    document.getElementById(+idbutton+).outerHTML="";
    }
</script>

but it doesnt work on jquery mobile using phonegap

thanks

Answer 1

You should use what you have. First the ajax call has its success callback. You should remove your button there. If the ajax call does not work (server not reachable), your button will remain. Second, you use jQuery in your project. Don't mix up jQuery and native Dom manipulation functions. Use the simple and readable jQuery function $('#'+idbutton).remove() to remove your button.

 < script >
function process(idbutton) {
    $.ajax({
        type: "POST",
        url: "http://urlofmysite.com/process.php?",
        data: "pidd=" + idbutton,
        cache: false,
        success: function (html) {
            alert(html); //RESPONSE FROM SERVER
            //REMOVING BUTTON
            $('#' + idbutton).remove();
        }
    });

}
<  / script >