If combined width of elements < body change a div's ID?
<p>I need to get the combined width of a set of divs (.image-div), and if their combined width is less than the body's width then change the ID of <code>#makeMeScrollable</code> to <code>#makeMeScrollable2</code>.</p>

<p>Here is what I have so far: </p>

<pre><code>$(document).ready(function() {
    $('#makeMeScrollable').each(function() {
        var totalImageWidth = 0;

        $(".image-div", this).each(function () {
          totalImageWidth += $(this).width();
        });

    if (totalImageWidth &lt; body ) {
    $(this).attr('id', 'makeMeScrollable2');
    }

    });
});
</code></pre>

<p>If I replace 'body' with a static number the code works so I must almost be there. I think this is just a syntax issue but I've tried every variation I can think of.</p>

<p>UPDATE Thanks to @ShankarSangoli ive got it working with the following: </p>

<pre><code>$(document).ready(function() {
$('#makeMeScrollable').each(function() {
    var totalImageWidth = 0;

    $(".image-div", this).each(function () {
      totalImageWidth += $(this).width();
    });

    if (totalImageWidth &lt; $(document.body).width() ) {
       $(this).attr('id', 'makeMeScrollable2');
    }

});
});
</code></pre>

<p>But is their a way of changing this line like this?: </p>

<pre><code>if (totalImageWidth - 1000 &lt; $(document.body).width() ) {
</code></pre>
