JSFiddle - React, Tailwind, and code Playground

HTML

<div id="conteudo" >
  <a href="#">Meu link</a>
    <p>Se clicar aqui, não vai poder fechar</p>
</div>

<a id="abre-conteudo" href="#">Aqui abre o #conteúdo. Se clicar aqui, não pode fechar</a>

CSS

#conteudo{
    
    height:50px;
   background-color:pink;
}

JavaScript

$(function(){

    $(document).click(function(e)
    {
        var condition = 
             $(e.target).is('#conteudo')  // verifica se o elemento clicado é o #conteudo
             || $('#conteudo').has(e.target).length // verifica se o elemento clicado está dentro de #conteudo
             || $(e.target).is('#abre-conteudo'); // verifica se o elemento é o clicado é o #abre-conteudo


        if ( condition ) {
           return false;
        }
        console.log( $(this).is('#abre-conteudo'));

        $("#conteudo").fadeOut();
    });
    
    $('#abre-conteudo').click(function(e){
            e.preventDefault();
         $('#conteudo').fadeIn();
     });

});