php - Show a submit button on table row mouseover

First of all, forgive me for being a beginner to Javascript and PHP.

Second: I have a table with some order information, and the first cell of every row consists of a submit button that will send the information from that row to a second page where it will be displayed.

I wrote a small Javascript function so that the submit buttons are hidden until someone mouses over them. But my problem is that the submit ID for the buttons is assigned to the first button, so no matter what row I mouse over, only the first submit button displays.

The display function is the following:

    function showButton(id) 
    {
        var e = document.getElementById(id);
        if(e.style.display == 'block')
           e.style.display = 'none';
        else
           e.style.display = 'block';
    }
Copy code

The row is defined as:

    tr onmouseover='showButton("submitButton");'
                   onmouseout='showButton("submitButton");'>
Copy code

And the button which is generated on every iteration of a new row is:

    input type='submit' id='submitButton' value='Submit' 
                   style='cursor: pointer; display: none;' />
Copy code

Any help would be greatly appreciated. I want the correct submit button appearing next to each row on mouseover.