How To Customise WordPress Comment Submit Button

Question

I am trying to customise the output code of

<?php comment_form(); ?>

At the moment the submit button outputs the following:

<p class="form-submit">
    <input name="submit" type="submit" id="submit" value="Post Comment">
    <input type="hidden" name="comment_post_ID" value="486" id="comment_post_ID">
    <input type="hidden" name="comment_parent" id="comment_parent" value="0">
</p>

I would like it to output the following:

<div class="darkbutton" onclick="document.commentform.submit()">
    <span class="darkbutton-left"></span><a href="javascript: submitform()">Log In</a>  
    <span class="darkbutton-right"></span>
</div>

so as the completely restyle the button. Now I know it could be done by editing the core Wordpress files in comment-template.php but I really don't want to have to do this if there is any other way.

Any suggestions greatly appreciated! :)

Answer 1

Have a trick

.form-submit{display: none;}

You can following after

$args = array(
 'comment_notes_after' => '<button type="submit" id="submit-new"><span>'.__('Post Comment').'</span></button>' 
);
comment_form($args);