Question

Consider this HTML snippet...

<div style="width:300px;" class="siblings">
  <ul>
    <li>Rupee</li>
    <li>Pound</li>
    <li id="usaCurrency">Dollar</li>
    <li>Franc</li>
  </ul>
</div>

Is it possible to change the usaCurrency Id to some other id, let's say, americanCurrency? If yes how?

2 Answers
<script>
  $(document).ready(function(){
    //This will set the id to 'americanCurrency'
    $("#usaCurrency").attr("id", "americanCurrency");

    //Now you can perform operations on the element using the new id, 
    //for instance, set the color of the element to blue
    $("#americanCurrency").css({"color": "blue", "border": "2px solid blue"});
});
</script>

A preferred option is to use prop() instead of attr()

<script>
  ...
  $("#usaCurrency").prop("id", "americanCurrency");
  ...
</script>