Currently, I am working on a tutorial to learn about basic jQuery plugins. I am facing a challenge in understanding why my code is not adjusting the height of my <p></p>.
The task requires creating a plugin that can set the height of specified elements without relying on .height().
Even though the simple plugin below does not modify the height, by changing the height property to something like margin within .css(), it functions flawlessly.
What could I be overlooking?
<body>
<p>Hello</p>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
(function($, window, document, undefined) {
$.fn.setHeight = function(hgt) {
return this.each(function() {
$(this).css('height', hgt);
});
};
})(jQuery, window, document);
</script>
<script>
$("p").setHeight(200)
</script>
</body>