JavaScript: Avoid ajax if not necessary and store small data locally in the page itself

Avoid ajax if not necessary and store small data locally in the page itself.
Example Case:We have to custom messages or descriptions on selecting an option of dropdown.
We can use some attribute like title inside the option tag of select/ Dropdown list to store some custom values/ descriptions and can be used to display the message or text without AJAX.


Here i used the following code for storing the currency of each country in the title field of the corresponding option and will be displayed when the country is selected.
HTML CODE


<table width="100%" class="noBorder" cellpadding="0" cellspacing="0">
      <tr>
        <td>
<select name="hostCountry" onchange="showhostcurrency(this);">
            <option value="">COUNTRY</option>
            <option title="Rupees" value="1">INDIA</option>
            <option title="USD" value="1">USA</option> 
</select>
        </td>
        <td class="showCurrency">
        </td>
</tr>
</table>

COUNTRY INDIA USA

function showhostcurrency(obj){
//Here the object will be passed to function which will be recieved to variable obj
//Value stored in title can be accessed as follows
     var currency=$(obj).find("option:selected").attr('title');
     if(currency!=''){
         var currency='Currency: '+currency;
     }
     $(obj).parent().parent().find('td.showCurrency').html(currency);
}