hope you can help me solving my problem.
These two images are linked somewhere on a site.
<a href="?FRUIT=banana><img height="40" src="../../banana.jpg?format=raw" title="Banana - yellow"></a>
<a href="?FRUIT=apple><img height="40" src="../../apple.jpg?format=raw" title="Apple - green"></a>
I want to border them to start writing a function.
As you can see the title of each image contains the fruit and a color which should be associated by hearing the fruit.
I started creating an array.
var colors = 'yellow','green';
Each element of the array should be bordered by 3px dotted green.
for(var i = 0;i < colors.length;i++){
.css('border','3px dotted green');
}
But how do I get the title of the image containing the color to border it with 3px dotted green?
Thank you in advance.
,
for(var i = 0;i < fruits.length;i++){
$('imgtitle$='+fruitsi+'').css('border','3px dotted green');
var title = $('#'+fruitsi).attr('title');
}
this is how you can get the title and will border all the images which title end with any of the colors in fruits array.
,
for clarity it would probably be better to use an object to reference your colors by fruit name.
var fruit_colors = {Banana: "yellow", Apple: "red", Lime: "green", Grape: "purple"};
for(k in fruit_colors){
$("imgtitle^=" + k).css("border","3px dotted " + fruit_colork)
}