JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<table>
<tbody>
<tr>
    <td><label>Total R$</label></td>
    <td><input type="number" min="0" class="total" value="100" /></td>
</tr>
<tr name="condicao-pag" id="condicao-pag">
    <td><label>Condição de pagamento:</label></td>
    <td>
        <select/>
            <option value=0>À vista</option>
            <option value=1>À prazo</option>
            <option value=2>Outros</option>
        </select>
    </td>
</tr>
<tr id="parcelamento" style="display:none"> 
    <td>Parcelar em</td>
    <td>
        <select id="n-parcelas">
            <option></option>
            <option value="2" selected>2x</option>
            <option value="3">3x</option>
            <option value="4">4x</option>
        </select>
    </td>
</tr>

<tr id="parcelas" style="display:none">
    <td>
        <input type="text" name="parcela[]" value="">
        <input type="date" value="">
   	</td>
    <td>
        <input type="text" name="parcela[]" value="">
        <input type="date" value="">
   	</td>
</tr>
</tbody>
</table>
</body>

JavaScript

$(document).ready(function(e) {
	
	$('#condicao-pag').on('change', 'select', function() {
		if($(this).val() == 1){
			$('#parcelamento').show();
			/*Calcular valor das parcelas (2x, 3x, 4x) e preencher inputs*/
			$('#parcelas').show();
		}
		else{
			$('#parcelamento').hide();
			$('#parcelas').hide();
			$("input[name='parcela[]']").val('');
		}
	})
		  
	$('#n-parcelas').on('change', function() {
		/*Calcular valor das parcelas (2x, 3x, 4x) e preencher inputs*/
	})
	 
	 
	});