I am attempting to apply different font-size values based on the input received from $("#company").val() and $("#firstname").val() within the container #page2. I have experimented with both the css() method and external stylesheets, but so far I have not been successful in achieving the desired result.
$(document).ready(function() {
$("#printid").hide();
$("#print").click(function() {
$(".form").hide();
$("#printid").show();
$("#page2").html($("#company").val() + "<br />" + $("#firstname").val())
});
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="form">
<form>
<p>
<label for="company">Comp: </label>
<input id="company" type="text">
</p>
<p>
<label for="name">Name: </label>
<input id="name" type="text">
</p>
</form>
<input type="button" id="print" value="Skriv Ut" />
</div>
<div id="printid">
<p id="page2"></p>
</div>