We Keep Coding

How can I remove the next div of the parent of an element?

function yes(event, yesicon) {
event.stopPropagation();
yesicon.closest('button').nextSibling.remove(); //Why doesn't this work???
yesicon.closest('button').remove(); //This works ok
}
<div class="doors_list" id="doors_list">
<button class="accordion">
<div>
<img src="Iconos/arrow_down.png" alt="Expand" class="arrow_icon">
</div>
<div>
<img src="Iconos/yes.png" onclick="yes(event,this);" alt="Yes" class="yes_icon">
</div>
<div>
<p class="door_room">Kitchen</p>
</div>
</button>
<div class="panel"> --THIS IS THE ONE I WANT TO DELETE --
<p>Info on Door 1</p>
</div>
</div>
Inside doors_list I actually have several buttons of class 'accordion' followed by the div of class 'panel' which is the one I want to delete for each one when the 'yes' icon is clicked.
What I want to do is to remove the next div of the class 'panel' with the "yes" function.
yesicon.closest('button') seems to be working ok but when I want to remove the nextSibling it doesn't seem to work.

You want to use nextElementSibling as it will, as its name implies, be the next sibling element. nextSibling will be whatever node follows, and in your case is going to be a text node: the white space characters between your elements.
function yes(event, yesicon) {
event.stopPropagation();
yesicon.closest('button').nextElementSibling.remove();
}
<div class="doors_list" id="doors_list">
<button class="accordion">
<div>
<img src="Iconos/arrow_down.png" alt="Expand" class="arrow_icon" />
</div>
<div>
<img src="Iconos/yes.png" onclick="yes(event,this);" alt="Yes" class="yes_icon" />
</div>
<div>
<p class="door_room">Kitchen</p>
</div>
</button>
<div class="panel">
--THIS IS THE ONE I WANT TO DELETE --
<p>Info on Door 1</p>
</div>
</div>

You have invalid HTML and that is the cause of your problem.
Leaving aside the issue that a <div> is not allowed inside a <button> in the first place…
The content of the button is:
Start div
img
End div
img
End div
Since there is no open div for the second end tag to close, error recovery implicitly closes the button, and then the div end tag closes the doors_list element.
Consequently: The element you are aiming for is not a sibling of the button, but of its parent.
Use a validator. Write valid HTML.

You forgot to open the div before your icon
</div>
<img src="Iconos/yes.png" onclick="yes(event,this);" alt="Yes" class="yes_icon">
</div>

Spoiler code with onclick and 2 conditions

I've got a spoiler-code on my Homepage.
The Code looks like this:
<div id="spoiler" style="display:none">
HIDDEN CONTENT HERE
</div>
<a display="initial"
id="button"
title="Click to show/hide content"
type="button"
onclick="if(document.getElementById('spoiler')
.style.display=='none') {
document.getElementById('spoiler')
.style.display=''
}else{
document.getElementById('spoiler')
.style.display='none'
}">
Show hidden content
</a>
What I want to do now is quite simple:
After clicking on the element "button", the hidden content shall be shown and the anchor <a> shall become invisible.
So what I am looking for is:
onclick: if element "spoiler" is on display=none AND element "button" is on display=initial THEN the element "spoiler" shall change to display=initial AND element "button" shall change to display=none
Is this possible?

This code in jquery will solve your problem. I hope this is what you wanted.
$('#button').click(function() {
$('#spoiler').css('display', 'block');
$(this).hide();
});
I have demo here as well.
A JavaScript only solution will be as follows:
<div id="spoiler" style="display:none">
HIDDEN CONTENT HERE
</div>
<a display="initial" id="button" title="Click to show/hide content" type="button" onclick="document.getElementById('spoiler').style.display='block';
document.getElementById('button').style.display='none'">Show hidden content</a>

Try following code. JSFiddle.
<div id="spoiler" style="display:none" onclick="this.style.display='none';">
HIDDEN CONTENT HERE
</div>
<a display="initial" id="button" title="Click to show/hide content" type="button" onclick="document.getElementById('spoiler').style.display='block';">Show hidden content</a>

display="initial" isn't a valid attribute. Also, putting all of that code in the onclick attribute prevents you from reusing the code in other spoiler blocks. The best solution is to use a script tag for separation of concerns and reusability.
Here's the bare-bones of what you need:
<div id="spoiler" style="display:none">HIDDEN CONTENT HERE</div>
<a onclick="showSpoiler(this,'spoiler')">Show hidden content</a>
<script>
function showSpoiler(buttonNode, spoilerId) {
document.getElementById(spoilerId).style.display='block';
buttonNode.style.display='none';
}
</script>

Issues implementing simple 'toggle' / (show/hide) on div, on mouseclick, using JavaScript

So I'm trying to make a div class element toggle/ or show hide an set of id elements upon mouse click. So on click on the 'result_location id' I'm trying to display all the divs under result_menu class beneath it.
Am I going the right way about this? Hope you can help! Here's my HTML and JS code:
HTML:
<div id="result_location">
<h3>MainText Here</h3>
</div>
<div class="result_menu">
<div id="a_column">
<h4>text</h4>
</div>
<div id="b_column">
<h4>text</h4>
</div>
<div id="c_column">
<h4>text</h4>
</div>
<div id="d_column">
<h4>text</h4>
</div>
</div>
</div>
</div>
JS:
$(document).ready(function() {
$('#result_location').click(function() {
$('.result_menu').slideToggle("fast");
});
});

It appears to be working fine for me, I threw up a quick html page without a problem. Only thing I can think of is that you must load jquery before the JS that you mentioned. Other than that it should be working!

Insert Div content in Div dynamically By Javascript

I work with Javascript and Html. I have two <div>
<div id="test1">
</div>
and
<div id="test2">
Hello World
</div>
and I also have button .when click button I want to div test2 insert into div test1
Can anybody help me?

in the click handler
$('#test2').appendTo('#test1')
Demo: Fiddle

SharePoint javascript: find all <a> in a div

I am trying to find all the tags in a div and compare the href to the page in the current url. If they are the same I will add css to the parent of the tag. Why wont this work to find the tags? This is being used in SharePoint.
<script>
var jse_vertical_nav = document.getElementById('JSE_vertical_nav');
alert(jse_vertical_nav.getElementsByTagName('a').length);
</script>
<div id="JSE_vertical_nav">
<div class="jse_link_row">
HOME
</div>
<div class="jse_link_row">
ABOUT
</div>
<div class="jse_link_row">
NEWS
</div>
</div>

It does not work, because you need to use JavaScript AFTER you output your HTML!