CODEWITHSUNDEEP
jqueryonclickaddclass
Davit
Davit

Reputation: 362

JQuery addClass on click

I am trying to add class using JQuery to a button when it is clicked. The following codes show my class and JQuery onclick event with its handler:

CSS

.input-highlight {
     background-color: #1E90FF;
     color: white;
}

JS

$("#elv-geo").on("click", hightlight);

function hightlight() {

    var georgian = $("#geo-elv");

    georgian.addClass("input-highlight");

}

When I had "visibility: hidden" in the class, it did work, but with the above code, it doesn't. Any ideas why?

Upvotes: 0

Views: 117

Answers (2)

AntouanK
AntouanK

Reputation: 4968

.input-highlight {
    background-color: #1E90FF;
    color: white;
}

var id = "#elv-geo"; // is it elv-geo or geo-elv?
$(id).on("click", highlight);

function highlight() {
    $(id).addClass("input-highlight");
}

Upvotes: 0

Yotam Omer
Yotam Omer

Reputation: 15356

You used once $("#geo-elv") and the other time $("#elv-geo"). This may cause your problem..

Also, you should consider using the following syntax:

$("#geo-elv").on('click',function(){
    $(this).addClass('input-highlight');
})

Upvotes: 1

Related Questions