Javascript hide button after click

[OsaMasw]

Hi there fellow daniweb programmers
I have problem in running function in javascript

<script type="text/JavaScript">
function toggle() {
    var e = document.getElementById('target_<? echo $id; ?>');
    e.style.display = 'none';
}

</script>

I have button that generated in php code so its repeating itself

<li><a id="target_<? echo $id; ?>" href="like.php" onclick="toggle()"><img src = "like.png" />Like</a></li>

the output code will be something like this

    <script type="text/JavaScript">
    function toggle() {
        var e = document.getElementById('target_1234');
        e.style.display = 'none';
    }

    </script>

    <li><a id="target_1234" href="like.php" onclick="toggle()"><img src = "like.png" />Like</a></li>

but its not workin as I desire, if I remove the target_<? echo $id; ?> the first item will works as the function do the others not.

[pritaeas]

You have more than one li. I suggest you do this:

<li><a id="target_<? echo $id; ?>" href="like.php" onclick="toggle(<? echo $id; ?>)"><img src = "like.png" />Like</a></li>

and change toggle to:

function toggle(id) {
    var e = document.getElementById('target_' + id);
    e.style.display = 'none';
}

Another option would be:

<li><a id="target_<? echo $id; ?>" href="like.php" onclick="toggle(this)"><img src = "like.png" />Like</a></li>

function toggle(obj) {
    obj.style.display = 'none';
}

[OsaMasw]

what, o_o I was wrong in javascript, thanks for the help, you are saver .