Question: I have list of html nodes (divs, with float left)

```
 1, 2, 3, 4, 5, 6, 7

```

I want to remove a node say 4, all the nodes after 4, i.e. here 5,6,7 should move left slowly. 

Is there any way I can do this? 

PS: I have only jquery in the project as long as possible I want to keep that way without including much libraries.

Answer: 
You can do it like this:

**HTML:**

```
    <div id="1">1</div>
    <div id="2">2</div>
    <div id="3">3</div>
    <div id="4">4</div>
    <div id="5">5</div>
    <div id="6">6</div>

```

**Jquery:**

```
$( "div" ).click(function() {
  $( this ).hide( 2000, function() {
    $( this ).remove();
  });
});

```

And **CSS:**

```
div {
background: green;
width: 30px;
height: 40px;
margin: 2px;
float: left;
color:white
}

```

[**DEMO**](http://jsfiddle.net/pawankullu/ppj9sjb0/)
Use [jQuery.hide()](http://api.jquery.com/hide/) and [jQuery.remove()](http://api.jquery.com/remove/)
 Try this-

```
   $("#4").hide('slow', function(){ $(this).remove(); });

```

**Update:-**

[DEMO](http://jsfiddle.net/vikrant47/0vogmj3c/)
-----------------------------------------------