Monday, 30 September 2013

Remove x amount of elements with .remove()

Remove x amount of elements with .remove()

I am not seeing any clear documentation on removing a certain amount of
elements without it being in a specific order, of course there are many
ways to remove a list of say 5 items, if they are in that order. What if
there is elements that you don't want removed in between? Let me show you
an example
FIDDLE: Below is just pieces from this fiddle, it would be easier just
taking a look at the fiddle.
HTML
<div class="item empty">Empty</div>
<div class="item empty">Empty</div>
<div class="item editable">Editable</div>
<div class="item empty">Empty</div>
</div>
<button class="demo">Demo</button>
jQuery
$('.demo').click(function() {
var length = $('.item').length,
columns = 12/6,
addColumn = columns - length
//Set this for subtracting elements if addColumn is a negitive
if(addColumn < 0) {
//Want to remove the amount of items which is -2 in this case
$('.item.empty').eq(/*Remove whatever amount of addColumn */ ).remove()
}
//Equals -2
alert(addColumn)
});
So just to be clear, I am trying to remove the amount of .empty items
based on whatever the amount is passed into the addColumn variable in this
case its static set at -2.
So I ask if addColumn < 0 is a negative number then we do subtraction
using .remove() and I need to remove the amount of .empty items equal to
the addColumn variable.
12/6 comes from a 12 column grid and the 6 is a two column layout span6
span6 and so if the layout is set at 4 columns we need to remove 2
columns, which is where the -2 comes from.

No comments:

Post a Comment