Hocus Pocus

Thanks for answering~ ! I think I kinda understood what you're explaining. You're using the link "http://placehold.it/400x150?text=" and you're saying to the javascript, to add the word apple, pear, after that link to complete the link, and have the final picture url, right ? Like if I have "apple", it will add apple to the url, and i'll have the img "http://placehold.it/400x150?text=apple". But the thing is that I explained it with fruits and placehold.it img because I thought I would be easier to explain what I'm trying to do. Actually, I'm trying to make something like a "rank system" for a forum. So you have the users, and they have different written ranks under their avatar like : admin, mod, member. This thing is already automatic, and the code is provided by the forum system I'm using (Forumotion). I've made three types of picture by myself, one for the admin, another for the mod, and the final one for the members. So depending on the written rank they have, I want to show a different picture. So, in a topic, for exemple, I'll have : one post from an admin, another one from a mod, and the final one from a member. So each of them has a different written rank and will have a different picture (just right next to their avatar) according to their written rank. And the javascript has to work multiple times for that. I'm sorry, I thought the exemple of the fruits would be easier to explain...

Thanks for responding ~ I tried to do that : <span id="fruit">apple</span> <img id="img" src=""> <span id="fruit">orange</span> <img id="img" src=""> <script type="text/javascript"> $(function() var fruit=".fruit span" $(fruit).each(function() if (document.getElementById("fruit").textContent == "orange") {document.getElementById("img").src="http://placehold.it/400x150?text=orange";} else if (document.getElementById("fruit").textContent == "apple") {document.getElementById("img").src="http://placehold.it/400x150?text=apple";} else if (document.getElementById("fruit").textContent == "pear") {document.getElementById("img").src="http://placehold.it/400x150?text=pear";} }); </script> But, of course, it would have been too easy if it could work just like that, so yeah... ahaha sadly I'm probably missing a lot of knowledge again

Hello ! I'm back with a new challenge ~ So here is my code, that I corrected with the help of Ingolme : <span id="fruit">apple</span> <img id="img" src=""> <script type="text/javascript"> if (document.getElementById("fruit").textContent == "orange") {document.getElementById("img").src="http://placehold.it/400x150?text=orange";} else if (document.getElementById("fruit").textContent == "apple") {document.getElementById("img").src="http://placehold.it/400x150?text=apple";} else if (document.getElementById("fruit").textContent == "pear") {document.getElementById("img").src="http://placehold.it/400x150?text=pear";} </script> It works just fine like this. But I can't make it work multiple times, like if I try this : <span id="fruit">apple</span> <img id="img" src=""> <span id="fruit">orange</span> <img id="img" src=""> Only the picture of the apple will appear. The javascript is applying only on the first <span id ="fruit"></span> How I can correct that and make it work multiples times on the same page ? Thank you ! ~

Thank you for helping me ! I was almost there ahah

Good morning, good evening~ I've been studying javascript for few hours, so I'm sorry if I'm making a lot of mistakes, and I hope I'll be able to learn from you guys, and do what I'm trying to build. (Also, I'm sorry, I'm not a native English speaker, so if you don't understand what I'm trying to do, or to explain, please feel free to ask me again, and I'll try to be more accurate.) I would like to have the content of a div called <div id ="fruit"> that control an <img id="imgfruit" src="">. So for exemple : <div id="fruit">orange</div> and the <img> will, for exemple, have the picture of an orange like <img id ="imgfruit" src=".../orange.png"> But at the same time, if I change the content of the div like : <div id="fruit">apple</div>, the <img> will have the picture of an apple. So according to the content of the div, the image could change. I tried to do that by myself, but it doesn't work properly : <span id="fruit">apple</span> <img id="img" src=""> <script type="text/javascript"> if (document.getElementById("fruit").textContent = "orange") {document.getElementById("img").src="http://placehold.it/400x150?text=orange";} else if (document.getElementById("fruit").textContent = "apple") {document.getElementById("img").src="http://placehold.it/400x150?text=apple";} else if (document.getElementById("fruit").textContent = "pear") {document.getElementById("img").src="http://placehold.it/400x150?text=pear";} </script> I'm probably missing something somewhere, but I can't find the solution, so if you can help, that would be very nice~ Thank you ! Edit : Also, I'm sorry for posting the same topic twice, my internet connection just got really bad when I submitted my topic, for some reasons, it was posted twice, and it doesn't look like I can delete it by myself. Sorry again !

Good morning, good evening~ I've been studying javascript for few hours, so I'm sorry if I'm making a lot of mistakes, and I hope I'll be able to learn from you guys, and do what I'm trying to build. (Also, I'm sorry, I'm not a native English speaker, so if you don't understand what I'm trying to do, or to explain, please feel free to ask me again, and I'll try to be more accurate.) I would like to have the content of a div called <div id ="fruit"> that control an <img id="imgfruit" src="">. So for exemple : <div id="fruit">orange</div> and the <img> will, for exemple, have the picture of an orange like <img id ="imgfruit" src=".../orange.png"> But at the same time, if I change the content of the div like : <div id="fruit">apple</div>, the <img> will have the picture of an apple. So according to the content of the div, the image could change. I tried to do that by myself, but it doesn't work properly : <span id="fruit">apple</span> <img id="img" src=""> <script type="text/javascript"> if (document.getElementById("fruit").textContent = "orange") {document.getElementById("img").src="http://placehold.it/400x150?text=orange";} else if (document.getElementById("fruit").textContent = "apple") {document.getElementById("img").src="http://placehold.it/400x150?text=apple";} else if (document.getElementById("fruit").textContent = "pear") {document.getElementById("img").src="http://placehold.it/400x150?text=pear";} </script> I'm probably missing something somewhere, but I can't find the solution, so if you can help, that would be very nice~ Thank you !