How do I border an image by selecting a part of the title?
<p>hope you can help me solving my problem.</p>

<p>These two images are linked somewhere on a site.</p>

<pre><code>&lt;a href=&quot;?FRUIT=banana&gt;&lt;img height=&quot;40&quot; src=&quot;../../banana.jpg?format=raw&quot; title=&quot;Banana - yellow&quot;&gt;&lt;/a&gt;

&lt;a href=&quot;?FRUIT=apple&gt;&lt;img height=&quot;40&quot; src=&quot;../../apple.jpg?format=raw&quot; title=&quot;Apple - green&quot;&gt;&lt;/a&gt;</code></pre>

<p>I want to border them to start writing a function.</p>

<p>As you can see the title of each image contains the fruit and a color which should be associated by hearing the fruit.</p>

<p>I started creating an array.</p>

<pre><code>var colors = ['yellow','green'];</code></pre>

<p>Each element of the array should be bordered by 3px dotted green.</p>

<pre><code>for(var i = 0;i &lt; colors.length;i++){
.css('border','3px dotted green');
}</code></pre>

<p>But how do I get the title of the image containing the color to border it with 3px dotted green?</p>

<p>Thank you in advance.</p>
