JQuery - Find images, append caption from attr
<p>I'm not (at all) familiar with JQuery and only dip my toe once in a blue moon. However, I have a need that I simply cannot find a quick solution for - despite my conviction that such a quick solution must be available :)</p>

<p>I have a div in which images may be floated amongst the text. I want to scan that div, select all the images therein(if any), give them a class, append a <code>&lt;p&gt;&lt;/p&gt;</code> to them, and enclose both <code>&lt;img&gt;</code> and matching <code>&lt;p&gt;</code> in their own wrapping div. Into that created paragraph block I then want to place the title attribute of said image.</p>

<p>I've tried Google and here, but both are coated with snippets dealing with plugins, whereas I just want a plug-and-play snippet I can place in my included js file. I have tried piecing together something myself from whats on the JQuery site, but it's a mess.</p>

<p>Any help at all greatly appreciated! </p>

<p>EDIT: Using the answer provided by @Xeon06 below, my completed working solution was as follows:</p>

<pre><code>$(".lorem img").each(function() { 
    $(this).addClass("inline-img"); 
    $(this).wrap("&lt;div&gt;"); 
    if ($(this).prop("title")!='') {
        $("&lt;p&gt;").text($(this).prop("title")).insertAfter($(this)); 
    }
});

$(".lorem div").each(function() { 
    $(this).addClass("inline-img-wrap"); 
});

$(".inline-img").each(function() { 
    var mTop = $(this).css('marginTop');
    var mBottom = $(this).css('marginBottom');
    var mLeft = $(this).css('marginLeft');
    var mRight = $(this).css('marginRight');
    var thisfloat = $(this).css('float');
    $(this).parent().css('marginTop', mTop);
    $(this).css('marginTop', '');
    $(this).parent().css('marginBottom', mBottom);
    $(this).css('marginBottom', '');
    $(this).parent().css('marginLeft', mLeft);
    $(this).css('marginLeft', '');
    $(this).parent().css('marginRight', mRight);
    $(this).css('marginRight', '');
    $(this).parent().css('float', thisfloat );
    $(this).css('float', '');
});
</code></pre>

<p>The last portion of code was to take the primary positioning attributes of the image (margin and float) and apply them instead to the wrapping div created earlier. I then wiped these values from the images themselves to avoid doubling-up. Excuse the noobish coding!</p>
