Как изменить стиль кнопки Clicked particuler?

Question

У меня есть два файла в xml.php я отображение данных из XML-файл также кнопки с данными XML отображения с помощью этого кода

<input type="button" id="class" value="Select this Agent" onClick="Selected(this.id);"> 

так кнопок, отображаемых на странице равно элементы в XML. и я хочу изменить цвет фона нажатой кнопки. вот мой код Javascript для изменения стиля кнопки

function Selected(ClickedId){ 
     alert(ClickedId); 
     ClickedId.css('background-color', 'Green'); 
    } 

и весь код

<?php 
       $xml = simplexml_load_file("agent.xml") or die("Error: Cannot create object"); 
       function processXML($node){ 
        foreach($node->children() as $agent => $data){  
         $agent= trim($agent); 
          if($agent!="" && $agent=='image'){ 
           ?><div class="inline"><?php 
           echo "<br>"; 
           echo "</br>"; 
           echo "</br>"; 
           echo '<img src='.$data.' >';?></div> 
           <!--<input type="button" value="Select this Agent">--><?php 
          } 
          elseif($agent == 'phone'){ 
          ?><div class="btqn"><input type="button" id="class" value="Select this Agent" onClick="Selected(this.id);"></div> <?php 

          } 
          elseif($agent!=""){ 
           ?> <div class="Table"><?php echo $data;?></div> 
           <?php 
           //echo "</br>"; 
          } 
          else{ 
           echo "<hr>"; 
          } 
          processXML($data); 
         } 
       } 
       processXML($xml); 
      ?> 

Так, пожалуйста, кто-нибудь может сказать мне, где я ошибаюсь. любое предложение должно быть заметно Пожалуйста, помогите

Answer 1

Попробуйте

измените эту строку

<input type="button" id="class" value="Select this Agent" onClick="Selected(this.id);"> 

в

<input type="button" id="class" value="Select this Agent" onclick="Selected(this);"> 

Примечание здесь вместо прохождения ид передать this ссылку.

Таким образом, вы можете использовать

function Selected(ClickedId){ 
    alert(ClickedId); 
    ClickedId.style.backgroundColor = 'green'; 
} 

JQuery

$("#class").click(function(){ 

$(this).css("background-color","green"); 

}) 

See Fiddle Demo

Answer 2

Попробуйте

document.getElementById(ClickedId).style.backgroundColor = "green"; 

[Обновлено часть, как пользователь запросил]

Первое изменение с идентификатора на селектор классов как идентификаторы не должно дублироваться и передать this вместо this.id. Также, если вы хотите очистить все остальные фоновые кнопки, вы можете использовать функцию getElementsByClassName(). HTML

<input type="button" class="class" value="Select this Agent" onClick="Selected(this);"> 
<input type="button" class="class" value="Select this Agent" onClick="Selected(this);"> 
<input type="button" class="class" value="Select this Agent" onClick="Selected(this);"> 

Javascript код

function Selected(elem) { 
     var buttons = document.getElementsByClassName('class'); 
     for (var i = 0; i < buttons.length; i++) { 
      buttons[i].style.backgroundColor = ''; 
     } 
     elem.style.backgroundColor = "green"; 
    } 

Jsfiddle here