Javascript after pressing button make button colored where id and class =

Question

I tried to search for this online but couldn't find anything that works

i want that after i press then class where id = 1 is changed to cls-checked

<a id='1' class='cls-up' onclick='vote("up",this);'></a>
<a id='1' class='cls-down' onclick='vote("up",this);'></a>

after pressing vote it goes to php and like is pressed i want to make users already see like without reloading

function vote(vote, val)
        {
            var params = {"vote": vote, "id": val.id};
            $.ajax({
                data:  params,
                url:   'vote.php',
                type:  'post',
                success:  function (response) {

                }
            });
        }

problem is i always have 2 elements with same id if each element had different id i could use this code

var x = document.getElementById("1");
x.className = "cls-2";

"_i always have 2 elements with same id_" Why? IDs within a document are supposed to be unique. — Teemu, Jan 02 '19 at 13:29
it's because these are like buttons and with id = image id so dislike and like button have same image that's why they are both same — Artis Laizans, Jan 02 '19 at 13:30
But they can't share the same ID, that's invalid HTML, and messes your script ... — Teemu, Jan 02 '19 at 13:31
it's only html, and it's working it was the easiest way to solve the problem without writting any extra code — Artis Laizans, Jan 02 '19 at 13:35
?? It doesn't solve the problem, it creates more problems ... — Teemu, Jan 02 '19 at 13:35
i just need code which changes cls-up class to cls-checked where class = cls-up and id = 1 — Artis Laizans, Jan 02 '19 at 13:38

score 0 · Answer 1 · answered Jan 02 '19 at 13:26

0

On click check the id and then add class to existing classList

function vote(e, status, elem) {
  e.preventDefault();
  if (elem.id === '1') {
    elem.classList.add('cls-2')
  }
}

.cls-2 {
  color: green;
}

<a id='1' class='cls' onclick='vote(event,"up",this);'>Hello</a>

answered Jan 02 '19 at 13:26

brk

48,835
10
56
78

hmm i don't think this will work i have just edited my question – Artis Laizans Jan 02 '19 at 13:32
id has to be unique.there cannot be duplicate id – brk Jan 02 '19 at 13:34
hmm yeah but it was only way i could make it work, and classes are different there just need code which finds class = cls-up with id 1 – Artis Laizans Jan 02 '19 at 13:36
no its wrong way to do. Use tag selector with wildcard class name – brk Jan 02 '19 at 13:38

Javascript after pressing button make button colored where id and class =

1 Answers1