JSFiddle - React, Tailwind, and code Playground

HTML

<select id="dropdown">
  <option>OP 1</option>
  <option>OP 2</option>
  <option>OP 3</option>
</select>

<div id="MyPartialViewContainer">

    <div id="PartialView1">
       <h2>
         Partial View 1
       </h2>
    </div>

    <div id="PartialView2">
       <h2>
         Partial View 2
       </h2>
    </div>

    <div id="PartialView3">
        <h2>
         Partial View 3
       </h2>
    </div>

    <div id="PartialView4">
        <h2>
         Partial View 4
       </h2>
    </div>

</div>

JavaScript

$(document).ready(function () {

		// reseta as partials views como hide no carregamento da página
		$("#PartialView1").hide();
		$("#PartialView2").hide();
    $("#PartialView3").hide();
    $("#PartialView4").hide();

    $("#dropdown").change(function () {
        var str = "";
        $("select option:selected").each(function () {
            str = $(this).text();
            if (str == "OP 1") {
                $("#PartialView1").show();
                $("#PartialView2").hide();
                $("#PartialView3").hide();
                $("#PartialView4").hide();
            }
            else if (str == "OP 2") {
                $("#PartialView1").hide();
                $("#PartialView2").show();
                $("#PartialView3").hide();
                $("#PartialView4").hide();
            }
            else if (str == "OP 3") {
                $("#PartialView1").hide();
                $("#PartialView2").hide();
                $("#PartialView3").show();
                $("#PartialView4").hide();
            }
            else {
                $("#PartialView1").hide();
                $("#PartialView2").hide();
                $("#PartialView3").hide();
                $("#PartialView4").show();
            }
        });
    });
});