Change css font-family for separate options in select tag

Question

I don\'t know if this is possible, and if not, if someone can throw out optional ideas, but I\'m attempting to display a drop down of different fonts (specifically, font\'s

Answer 1

You cannot set the font of the tag but you could create a list with specific styles (as you would expect)

Here's everything I've been trying:

$("select.js option:eq(0), ul li:eq(0)").css("fontFamily", "tangerine");
$("select.js option:eq(1), ul li:eq(1)").css("fontFamily", "tahoma");
$("select.js option:eq(2), ul li:eq(2)").css("fontFamily", "times new roman");

h1 {
  font-size: 1.2em;
  margin-top: 10px;
  color: #777;
}
.tangerine {
  font-family: tangerine;
}
.tahoma {
  font-family: tahoma;
}
.timesnewroman {
  font-family: times new roman;
}

Set with jQuery

    Tangerine
    Tahoma
    Times New Roman

 
Set with CSS

    Tangerine
    Tahoma
    Times New Roman

 
List

    
Tangerine
    
Tahoma
    
Times New Roman