[jQuery] Moving a div container from within to before a p container
<html>
<body>
Hi folks,
The following function takes an image tag (or table) that appears within
a p tag container in the form
<tt>< p> <img> text < /p>
</tt>and wraps the image (and caption if a title is present) into a div
for floating left, right, or centering.
My problem is that I don't know how to shift the processed image from
within the p container to immediately before it (so that the created div
is not within a p container)
I'd appreciate help in this next step.
Thanks,
Bruce
<tt>function fnDoImages() {
<x-tab> </x-tab>
$('img.imgposl,img.imgposr,img.imgposc,img.tblposl,img.tblposr,img.tblposc').each(function(i)
{
<x-tab> </x-tab><x-tab>
</x-tab>var a =
$(this).attr('alt');
<x-tab> </x-tab><x-tab>
</x-tab>var q =
$(this).attr('class').substr(0,3);
<x-tab> </x-tab><x-tab>
</x-tab>var p =
$(this).attr('class').substr(6);
<x-tab> </x-tab><x-tab>
</x-tab>var t =
$(this).attr('title');<x-tab> </x-tab><x-tab>
</x-tab>
<x-tab> </x-tab><x-tab>
</x-tab>var w =
$(this).attr('width');
<x-tab> </x-tab><x-tab>
</x-tab>if (a.length=0)
{
<x-tab> </x-tab><x-tab>
</x-tab><x-tab>
</x-tab>
$(this).attr('alt',''+t+'');
<x-tab> </x-tab><x-tab>
</x-tab>}
<x-tab> </x-tab><x-tab>
</x-tab>
$(this).wrap("<div class='buggybox clearfix'
id='g"+i+"'></div>");
<x-tab> </x-tab><x-tab>
</x-tab>if (q=='tbl'
&& t.length>0) {
<x-tab> </x-tab><x-tab>
</x-tab>
$(this).before("<p class='imgcaption'
style='width:"+w+"px;'>"+t+"");
<x-tab> </x-tab><x-tab>
</x-tab>} else if
(t.length>0){
<x-tab> </x-tab><x-tab>
</x-tab>
//$(this).after("<p class='imgcaption'
style='width:"+w+"px;'>"+t+"");
<x-tab> </x-tab><x-tab>
</x-tab>};
<x-tab> </x-tab><x-tab>
</x-tab>
$("#g"+i).addClass("img"+p).css({width:w+'px'});
<x-tab> </x-tab>});
}
</body>
</html>