選択リストの<option>のスタイルはどうですか？

Question

これは私の現在のリストです（私はそれを省略しました）。これはPHPとMySQLを使用して動的に作成されます。

<select name="id_country" id="id_country" class=" opc-form-control"> 
    <option value="231">Afghanistan</option> 
    <option value="244">Åland Islands</option> 
    <option value="230">Albania</option> 
    <option value="38">Algeria</option> 
    <option value="39">American Samoa</option> 
    <option value="40">Andorra</option> 
    <option value="41">Angola</option> 
    <option value="42">Anguilla</option> 
    <option value="232">Antarctica</option> 
    <option value="43">Antigua and Barbuda</option> 
    <option value="44">Argentina</option> 
    <option value="45">Armenia</option> 
    <option value="46">Aruba</option> 
    <option value="24" selected="selected">Australia</option> 
    <option value="2">Austria</option> 
    <option value="47">Azerbaijan</option> 
</select> 

私はオプションの後に「のborder-bottom」、または「時間」、または「------------から3何かを表示したいです-------- "

CSSを使用することはできませんが、これはJqueryで実現できますが、どうすればよいですか？

Answer 1

を動作しません。あなたは、第3回オプションの後に無効なオプションを挿入することができますリストは次のjQueryを使用しています。オプションのリストが変更されない場合は、HTMLで手動で行うこともできます。

$('#id_country option:nth-child(3)').after('<option disabled="disabled">----</option>');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select name="id_country" id="id_country" class=" opc-form-control"> 
 
    <option value="231">Afghanistan</option> 
 
    <option value="244">Åland Islands</option> 
 
    <option value="230">Albania</option> 
 
    <option value="38">Algeria</option> 
 
    <option value="39">American Samoa</option> 
 
    <option value="40">Andorra</option> 
 
</select>

Answer 2

あなたは

<option disabled="disabled">------</option> 

ようなオプション/無効を追加することができ、他のオプションは、CSSを使用することであるが、すべてのブラウザで