Attempting to selectively apply padding to specific boxes on the left and right is proving challenging. The code isn't recognizing the "getElementByClassName" part as expected. When I execute the script, I receive an alert for "Test1" but not "Test2," indicating a potential issue with that particular line.
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script type="text/javascript" >
var numProducts = $('.product').length;
for(var i = 1;i<numProducts;i++){
var x = (i+1)/3;
if(x%1=0){
alert("test1");
var box = document.getElementByClassName('product')[i-1];
alert("test2");
box.style.paddingRight ="30px";
box.style.paddingLeft="30px";
}
}
</script>
The values of numProducts, i, and x are being correctly retrieved, eliminating them as potential culprits. Any insights on what steps I should take next would be greatly appreciated. Thank you.