Question

I have quite a complex piece of code (JQuery and HTML5 Web SQL) that removes info from a database. However, whilst the database removal works fine I want to make the info disappear from view in the meantime (it wont go until the page refreshes and the database is queried again).

I’m pretty sure its just a matter of getting the selectors right

Currently I have

$('.remove_event').live('click', function() {
    //TRIGGERS SQL REMOVE
    mbffdb.webdb.deleteevent($(this).attr('id')),
    //MAKES INFO DISSAPPEAR
    $(this).attr('id').addClass('displaynone');
});//END CLICK

The info is cotained in a div that is given a dynamic id
: $(this).attr('id') (the ID is used in the SQL statement to remove).

If anyone can help me that would be really awesome!

Answer 1

Problem is, you add a class… to a string.
Follow me:

$(this) 

is an element

$(this).attr("id") 

is the value of it’s attribute “id”, i.e. a string so you can’t add a class to it.

By the way, do you want to add an id or a class? it’s not clear. If you want to add an id, use .attr("id","mynewid"). If you want to add a class, use $(this).addClass("class")

---

Edit: you may have been misled by JQuery’s chainability, i.e. many functions operating on a JQUery element or set of elements return another element or set of elements.

For example:

$("div.mydiv").parent().next().find("p").removeClass("otherclass");
              ^        ^      ^         ^

In every call (^) the functions return other elements so you can attach another function to operate on those elements, yieling more elements and so on.
But this is not true for some of the functions like:

.val() .text() .html()

that return “pure” values, not elements, so there’s no sense in using, after them, functions like addClass() which still operate con elements.