JSFiddle - React, Tailwind, and code Playground

HTML

<select name="valor" id="operadoraRecarga" class="form-control operadoraRecarga">
    <option value="claro">Claro</option>
    <option value="tim">Tim</option>
    <option value="oi">Oi</option>
    <option value="vivo">Vivo</option>
    <option value="nextel">Nextel</option>
</select>
<select id="valorRecarga"></select>

JavaScript

jQuery(document).ready(function($) {
    var precos = {
        claro: ["10.00", "13.00", "15.00", "20.00", "30.00", "50.00", "100.00"],
        vivo: ["5.00", "10.00", "15.00", "20.00", "25.00", "35.00", "100.00"],
        oi: ["10.00", "14.00", "18.00", "20.00", "25.00", "30.00", "35.00", "40.00", "50.00", "75.00", "100.00"],
        tim: ["7.00", "15.00", "20.00", "30.00", "35.00", "50.00", "100.00"],
        nextel: ["20.00", "30.00", "50.00", "100.00"]
    }

    $("#operadoraRecarga").change(function() {
        var selecionado = this.value;
        var html = precos[selecionado].reduce(function(str, preco) {
            return str + '<option value="' + preco + '">' + preco + '</option>';
        }, '');
        $("#valorRecarga").html(html);
    })
});