Been working on this piece of code for about 4 hours now, can't get it to work! I genuinely don't know why - I've been looking at it and have no idea what's wrong. Have been stubbornly trying not to ask for help, but now I give up. Can anyone see the problem in this code:

2. $(function () {
3. $('.multi').click(function(){
4. $(this).closest('.full-width')
5. .after('<div class="row full-width"> <div class="triangle"> </div> <div class="gridfix"> <div class="medium-12 columns section center"> <h1> What are the options? </h1> <input id="inputtrigger" type="text" placeholder="Type in a choice" /> <input class="button white hidden addquestion"  type="submit" value="Add Question to Survey" /> </div> </div> </div>');
6. })
7. })

Here's the html: 

2. <div class="row full-width ghost hidden grey typedummy">
3.   <div class="triangle"> </div>
4.     <div class="gridfix">
5.       <div class="medium-12 columns section center">
6.         <h1> What kind of question is it? </h1>
7.           <a class="button multi">Multiple Choice with one answer</a>
8.           <a class="button multi">Multiple Choice tick all that apply</a>
9.           <a class="button">Text Field</a>
10.           <a class="button">Rating</a>
11.         </div>
12.       </div>
13.     </div>
14.   </div>

Pointers much appreciated!

EDIT: It just occurred to me that the code might not be working because the html above had been cloned in using this code:

2. var seashell = 0;
3. var klon = $( '#question'+ seashell );
4. 
   
5. 
   
6. $(function() {
7. $('.addnew').click(function(event){
8. $(this).after('<h5> Question 1 of 1 currently being edited </h5>').css("display", "none");
9. $('.full-width').toggleClass('grey');
10. klon.clone().attr('id', 'question'+(++seashell) ).insertBefore('#newq');
11. });
12. });

I don't know enough to know whether that's an issue or not. Could it be being excluded from jQuery's scope of reach because it wasn't there on $(document).ready ?

Thanks