Работа с переключателями во внешнем JavaScript

Question

Итак, у меня есть страница с тремя переключателями, как таковые

Я хочу сделать так, чтобы при нажатии на одну из этих кнопок размер шрифта элементаизменения как таковые

$("viewer").style.fontSize = "5pt";

Довольно просто сделать это в javascript с тремя отдельными функциями.Должно работать что-то вроде следующего, хотя я не проверял это

window.onload = function() {
    $("small").onclick = small;
    $("medium").onclick = medium;
}

function small(){
    $("viewer").style.fontSize = "5pt";
}

function medium(){
    $("viewer").style.fontSize = "15pt";
}

Есть ли способ объединить их в одну большую функцию?

Answer 1

<input type="radio" name="size" value="small">Small
<input type="radio" name="size" value="medium">Medium
<input type="radio" name="size" value="large">Large

<script>
$('input[name=size]').click(function()
{
    var clickedVal = $(this).val();
    var size = 5;

    switch (clickedVal)
    {
        case 'small':
            size = 5;
        break;

        case 'medium':
            size = 10;
        break;

        case 'large':
            size = 15;
        break;
    }

    $('#viewer').css('fontSize', size + 'pt');
}
</script>

Answer 2

<input type="radio" name="size" value="5">Small
<input type="radio" name="size" value="15">Medium
<input type="radio" name="size" value="25">Large
<input type="radio" name="size" value="35">Super Big

<script>
$('input[name=size]').click(function() {
   $('#viewer').css('fontSize', $(this).val() + 'pt');
}
</script>

Вы можете добавить новые переключатели для большего размера без необходимости изменять скрипт.

Answer 3

function changeSize(size, elem){
   elem.css('font-size', size);
}