Again, you are misusing HTML.
This would be *ILLEGAL* HTML:
Within each <article> is ...the comment link
<a id="coment" href="#" class="postnav">Comment</a>
Once again: IDS MUST BE UNIQUE ON A PAGE. So using id="coment"
(I assume that should really be "comment"?) is illegal.
<a id="comment<?php echo $noid['id']; ?> href="#" class="postnav">
Then, in your JS code that process a click on such a link, simply pick up the ID of the <a> tag, strip off the first 6 characters, and there is your ID!
I don't know how you are attaching the onclick events to those <a> tags, but I would assume something along these lines:
var postlinks = document.getElementsByClassName("postnav");
for ( var p = 0; p < postlinks.length; ++p )
postlinks[p].onclick = fillinCommentForm;
function createCommentForm( )
var form = document.getElementById("commentForm");
form.articleid.value = this.id.substring(6);
... whatever else is needed ...
// see below
var div = document.getElementById("hideForm");
div.style.left = ...;
div.style.top = ...; // possibly position it above the comment??
div.style.display = "block";
And I *certainly* would NOT create the form or its contents using innerHTML. There is no reason for that.
If you don't want the form to show up until the user clicks on a comment link, then just hide it until then. Perhaps something like this:
<div id="hideForm" style="display: none; position: absolute; ...">
<form id="commentForm" ...>
<input type="hidden" name="articleid" />