Moving strings and triggering events with jquery

Question

So this follows along with some similar questions that have been asked on here but mine is a very specific scenario I'm trying to work within. The situation is I'm on the production end of a CMS and I need to manipulate a forms module in a very specific way but my current access is very limited. In plain english, I need to be able to click a button, have that click append a specific string into a text field and then trigger the click event on another button after this string has been appended. What I have so far, while not perfect, seems like it should work but is not. And yes I'm aware that this is a very odd, roundabout way of doing this but it's a short-term hotfix to accommodate a deadline so trust me when I say this approach is the only current option.

The code:

CSS:

<style>
 .form-group {
   visibility: hidden;
 }
 input[type="submit"] {
   visibility: hidden;
 }
</style>

Js:

<script>
  $("#yes").click(function(){
    $('#yesHide').contents().appendTo('#textFieldID');
    $('#submitID').trigger('click');
  });

  $("#no").click(function(){
    $('#noHide').contents().appendTo('#textFieldID');
    $('#submitID').trigger('click');
  });
</script>

HTML:

<a id="yes">yes</a>
<a id="no">no</a>
<p id="yesHide" style="visibility: hidden;">This page was helpful</p>
<p id="noHide" style="visibility: hidden;">This page was not helpful</p>

Answer 1

If the button lives in a form, you can try triggering the submit on the form like this:

$('#formID').trigger('submit');

Otherwise, you'll need an event handler on your #submitID button that actually does something, otherwise you'll be triggering an event that isn't being listened for.