You could use the jQuery before() method
peirix
2009-09-04 05:55:52
I think the difference between our ideas is prependTo would add the new element *inside* the target element, so if he started with ` <p class="addChoice cutsom_button"><a></a></p>">` and used prependTo("<p>blah</p>'), he'd end up with : `<p class="addChoice cutsom_button"><p>blah</p><a></a></p>` but with before, he'd get: `<p>blah</p><p class="addChoice cutsom_button"><a></a></p>`
Anthony
2009-09-04 06:07:09
+1
A:
appendTo() adds things to the end of that element.
I think you want prependTo().
Anthony
2009-09-04 05:59:33
but that would make things appear in the wrong order in his case, since he's doing 4 appends for each click. Using prependTo would be a better option, though, if all the html was put together in one string first, then prepended. (Which actually is the best way to do it anyway (fewer DOM-interactions))
peirix
2009-09-04 06:02:21
It would put them in the wrong order even if they are called all at once in a selector?
Anthony
2009-09-04 06:09:30
Nope, only if they are called one after another. Because the second would be put in before the first, and the third would be put in before the second and so on. But chaining them would fix the problem.
peirix
2009-09-04 06:11:50
Oh I see what you mean. If they click add more than once it would go at the top of the first one...I would personally have it start off with a default option and then have it go After() the last option in the element (or appendTo the element if they were at the very bottom).
Anthony
2009-09-04 06:22:43
+1
A:
You can chain it together as a single string and use jQuery's before method to insert the HTML before the .addChoice element:
$('.addChoice').live('click', function(){
var length=$('.fieldChoices input').length + 1;
$(this).before(
'<input id="Choice' + length + '" maxlength="150" value="option' + length + '" />' +
'<div class="seperator" />' +
'<p class="deleteChoice' + length + ' cutsom_button"><a href="#" class="btn lbOn deletechoice"><span class="button_image"><span class="background_16 user_reply">Delete</span></span></a></p>' +
'<div class="seperator" />'
);
return false;
});
brianreavis
2009-09-04 06:03:29