$(document).ready(function () {
var css = {
'color': 'Red',
'text-decoration': 'underline',
'font-size': '30px'
}
$("#sibling").click(function () {
$("#targetDiv").siblings().css(css);
});
$("#siblingSelector").click(function () {
$("#targetDiv").siblings("p").css(css);
});
});
<html>
<head>
<title>sibling</title>
</head>
<body>
<div id="mainDiv">
<div id="targetDiv">This is div element inside another div.</div>
<p>This is paragraph1 inside div element. It is sibling to div with id = "targetDiv" </p>
<span>This is span element.</span><br>
<em>This is emphasize element.<em>
</div>
<input type="button" id="sibling" value="Siblings" />
<input type="button" id="siblingSelector" Value="Siblings with Selector" />
<input type="button" id="reset" value="Reset" onclick="location.reload()" />
</body>
</html>