Question: am trying to remove a div inserted by jquery onclick. for some reason its just not working i tried remove(); hide(); css(); empty(); they all are just not working.. so here's my js function

```
function callme()
{
var content = '<div id="floating_box" class="fb">'
'sdfsdfsdfsdfsfsddsfsfsdfsdfsdfsfsdfsdfsdfsfsdfsd'
'</div>';
jQuery('body.floating_box').empty();
jQuery('body').append(content);
}

```

and here is my html code

```
<div id="notify" class="nn" onclick="callme()">
 <span id="nbox" class="nb">
<img src="gn16.png">
<span id="ntext" class="nt">23</span>
</span>
</div>

```

Answer: 
use `jQuery('#floating_box')`

You are using an id, but are not referencing it as one ..

You need to use the `.remove()` method, because with the `.empty()` you are creating multiple elements with the same id which is **invalid**

Have a look at this [demo](http://www.jsfiddle.net/WJf75/)

---

***Update***

After the comment, i see that you want the 1st time you click to create the element, and subsequent clicks to just show/hide it ..

use this code

```
$('#notify').click(
function (){
    if ($('#floating_box').length > 0) // it exists
    {
        jQuery('#floating_box').toggle(); // show/hide\
    }
    else //does not exist 1st time only..
    {
        var content = '<div id="floating_box" class="fb">popup</div>';
        jQuery('body').append(content);
    }
});

```

and remove the `onclick="callme"` from the element..
```
var content = '<div id="floating_box" class="fb">' +
'sdfsdfsdfsdfsfsddsfsfsdfsdfsdfsfsdfsdfsdfsfsdfsd' +
'</div>';

```

See the **+** ??

```
jQuery('body.floating_box').remove(); // edit: sorry my mistake
jQuery('body #floating_box').remove(); // better? should remove all elements within <body> with the id "floating_box"

```

Should be just fine.