0

I'd like to change the "id" of an image (instead of toggleclass, because the class is already being used) like this :

<img src="<?php echo HTTP_IMAGES_PATH; ?>roof.png" class="img-responsive" id="roof" />
<button onclick="changeID('roof_red')">RED</button>

with the javascript part :

function changeID(this_color) {
        $('roof').attr('id', this_color);
        console.log(this_color);
    }

And the HTML :

<button onclick="changeID('roof_red')">RED</button>

It is not working and when I look at the log, there's a reference error : $ is not defined... What am I doing wrong please?

dujmovicv
  • 65
  • 12

2 Answers2

0

It sounds like jQuery didn't load correctly. Check out this answer troubleshooting help.

Community
  • 1
  • 1
Kevin
  • 281
  • 2
  • 7
0

The error is that if you want to use jQuery (making an educated guess...) you have to include it in the page. probably missing some <script src="jquery.js"></script> or a variant of this.

Regarding what you're doing wrong, well, there's little to no good reason to change an element ID, and not manipulating CSS classes or attributes is definitely not a good reason.

Amit
  • 45,440
  • 9
  • 78
  • 110
  • Yes, the jquery.js was missing. I can see the console.log now, but the ID still doesn't change... – dujmovicv Aug 03 '15 at 22:01
  • I answered that part as well. You should use CSS to control styles, not modify IDs for that. – Amit Aug 03 '15 at 22:04
  • But it's not an answer to my question. I asked how to change the id value of the img tag with javascript. – dujmovicv Aug 05 '15 at 06:08
  • @dujmovicv - I advise you to read [XY Problem](http://meta.stackexchange.com/questions/66377/what-is-the-xy-problem) (That's not an answer to your specific question, but it's important that you understand this concept). After that read my answer and earlier comment again. I **strongly** recommend you not to try changing the ID. – Amit Aug 05 '15 at 06:19